【黑师代码】代码套用实例及说明（一楼新增加单图音画代码模板）

花简静

单图音画帖代码新模板（黑师20240526出品）：
<div style="position: relative; margin: 20px 0 20px calc(50% - 890px); width: 1600px; height: 720px; background: url('图片地址') no-repeat center/cover; border: 1px solid red; z-index: 1;"></div>
<audio src="音频地址" autoplay loop></audio>

代码中的红色部分是需要修改的部分：

（一）margin: 20px 0 20px calc(50% - 890px);
        890 根据 1600 即帖子预设宽度而来，应按实际尺寸进行计算，计算公式是：帖子宽度÷2+90；

（二）width: 1600px;
        这是设置帖子的宽度，1600 只是举例，实际尺寸以图片实际宽度为依据；

（三）height: 720px;
        这是设置帖子高度，道理同（二）；

（四）src="音频地址"
        这里是加背景音乐

简单的音画代码套用方法之一（特点：只有动态，无歌词及其它）
1.【黑师代码套用（通用代码1)】1动态无小播无歌词
2.【黑师代码套用（通用代码2)】1动态1动画无小播无歌词
3.【黑师代码套用（通用代码3)】2动态无小播无歌词
①【黑师代码套用实例】【简静音画】《明明》2动态无小播无歌词



黑师音画代码套用方法二（特点：有动态，有小播。无歌词。）
1.使用【黑师音画编辑器】生成贴子代码
2.【黑师代码套用实例】【简静音画】《乘风》（视频被切成椭圆形）


   

花简静

黑师音画代码套用方法三（特点：有动态，图片当小播，有歌词。）
1.  使用【黑师音画编辑器】生成贴子
2.【黑师代码套用实例】【简静音画】《女人花》（小花按纽控制音乐播放）
3.【黑师代码套用实例】【简静音画】《元旦快乐》（小花按纽控制音乐播放）
4.【黑师代码套用实例】【简静音画】《春暖花开》（小花按纽控制音乐播放）






黑师音画代码套用方法四（特点：有动态，有小播，有进度条，有歌词。）
1.【黑师代码套用实例】【简静音画】《想把我唱给你听》（ypPlayer播放器效果）
2.【黑师代码套用实例】【简静音画】《不曾改变》（1.27雨巷播放效果）
3.【黑师代码套用实例】【简静音画】《深呼吸-沉浸》（range进度条效课）

花简静

黑师音画代码套用方法之五（特点：19种小播套用方法。）
1.【黑师代码套用实例】【简静音画】《想你时风起》（之4普通频谱）
2.【黑师代码套用实例】【简静音画】《瞬间》（之4普通频谱）
3.【黑师代码套用实例】【简静音画】《一次就好》（之5meter频谱 ）
4.【黑师代码套用实例】【简静音画】《逝年》（之15老唱机 ）
5.【黑师代码套用实例】【简静音画】《时间都去哪儿了》（之13卡式磁带）

花简静

音画代码套用方法之六（特点：6种响应式播放器）
1.【黑师代码套用实例之61】【简静音画】《落雨听禅》（之一柱状简单频谱 ）

花简静

音画代码套用方法之七（特点：SVG小播套用方法。）
1.【黑师代码套用实例】【简静音画】《你笑起来真好看》（小伞路径播放器）
2.【黑师代码套用实例】【简静音画】《时光》（杯子路径播放器）
3.【黑师代码套用实例】【简静音画】《暖春》（自由路径播放器）

花简静

音画代码套用方法之八（特点：粒子、水波等代码特效贴子套用）
1.【黑师代码套用实例】【简静音画】《因为遇见你》（水波特效）
2.【黑师代码套用实例】【简静音画】《周深-Eyes on me》（小花粒子来回飞效果）
3.【黑师代码套用实例】【简静音画】《温暖》（粒子在方形灯内内来回飞效果）
4.【黑师代码套用实例】【简静音画】《彩色的雪》（彩色的雪粒子及山茶花播放器变色效果）
5.【黑师代码套用实例】【简静音画】《狮子舞绣球》（粒子在水晶球内来回飞效果）

花简静

音画代码套用方法之九（特点：其它效果贴子套用）
1.【黑师代码套用实例】【简静音画】《一生一念》（多层图片旋转小播）
2.【黑师代码套用实例】【简静音画】《因为有你》（视频椭圆裁剪效果）
3.【黑师代码套用实例】【简静音画】《灵韵》（背景闪烁及半图摇曳效果）
4.【黑师代码套用实例】【简静音画】《醉江南》（双图来回移动效果加鼠标跟随下雨效果）

花简静

音画代码套用方法之十（特点：歌词背景变化效果）
1.【黑师代码套用实例】【简静音画】《人间浪漫》（图片当歌词背景）
2.【黑师代码套用实例】【简静音画】《深呼吸-沉浸》（斜纹歌词背景）

花简静

音画代码套用方法之十一（特点：双层图片变化效果套用）
1.【黑师代码套用实例】【简静音画】《响沙湾的呼唤》（遮罩效果，图片隐现）
2.【黑师代码套用实例】【醉美水芙蓉音画】《新年快乐》（遮罩效果，图片隐现）

花简静