醉美水芙蓉 发表于 2024-9-22 17:21

庆祝国庆！祝论坛朋友国庆节快乐！

本帖最后由 醉美水芙蓉 于 2024-9-22 19:45 编辑 <br /><br /><style>
#mama {
        margin: 130px 0 30px calc(50% - 721px);
        width: 1280px;
        height: 720px;
        box-shadow: 0 0 8px gray;
        overflow: hidden;
        z-index: 1;
        position: relative;
}
#mama > video {
        position: absolute;
        width: 110%;
        height: 120%;
        top:-100px;
object-fit: cover;
        pointer-events: none;
}
.xiankuang {
        position: absolute;
        width: 100%;
        height:100%;
       
background: url('https://pic.imgdb.cn/item/66efde7df21886ccc071c0d0.png') no-repeat center/cover;
}
</style>

<div id="mama" class="mama">
        <audio src="https://music.163.com/song/media/outer/url?id=5284585" autoplay loop></audio>
        <video src="https://img.tukuppt.com/video_show/2629112/00/02/21/5b540e9ddfa0c.mp4" autoplay loop muted></video>
      <div class="xiankuang"></div>
</div>

<script>
var sf = document.createElement('script');
sf.charset = 'utf-8';
sf.src = 'https://638183.freep.cn/638183/web/js2024/huakuai_yslrc.js';
document.body.appendChild(sf);

sf.onload = () => {
        HCPlayer({
                papa: '#mama',
                geci: geci,
                skip: 0,
                average: 0,
                player_css: 'left: 140px; bottom: 10px; --ww: 240px; --slider: #901889; --track: #f6d5f4; --prog: #a72fa1; --color: #901889',
                lrc_css: 'left: 60px; bottom: 40px; --bg: url("https://pic.imgdb.cn/item/66caaf99d9c307b7e97df388.gif"); color: #fae5f9; font: bold 3.3em KaiTi;',
                fs_css: 'right: 20px; bottom: 20px; --bg: transparent; --color: #eee;',
        });
};

var geci = `
       我的中国心 - 张明敏
词：黄沾
曲：王福龄
LRC编辑：醉美水芙蓉
河山只在我梦萦
祖国已多年未亲近
可是不管怎样也改变不了
我的中国心
洋装虽然穿在身
我心依然是中国心
我的祖先早已把我的一切
烙上中国印
长江长城
黄山黄河
在我心中重千斤
无论何时无论何地
心中一样亲
流在心里的血
澎湃着中华的声音
就算身在他乡也改变不了
我的中国心
长江长城
黄山黄河
在我心中重千斤
无论何时无论何地
心中一样亲
流在心里的血
澎湃着中华的声音
就算身在他乡也改变不了
我的中国心
谢谢欣赏！
`;
</script>

梦油 发表于 2024-9-22 20:30

预祝芙蓉和朋友们国庆节快乐！

红影 发表于 2024-9-22 20:39

祝福伟大的祖国生日快乐。这制作真好，歌词颜色很别致。
欣赏水芙蓉美女好帖，同祝国庆快乐{:4_187:}

醉美水芙蓉 发表于 2024-9-22 21:17

梦油 发表于 2024-9-22 20:30
预祝芙蓉和朋友们国庆节快乐！

梦油老师国庆节快乐！

醉美水芙蓉 发表于 2024-9-22 21:18

红影 发表于 2024-9-22 20:39
祝福伟大的祖国生日快乐。这制作真好，歌词颜色很别致。
欣赏水芙蓉美女好帖，同祝国庆快乐

谢谢红影美女鼓励！

红影 发表于 2024-9-22 22:41

醉美水芙蓉 发表于 2024-9-22 21:18
谢谢红影美女鼓励！

问好水芙蓉美女，晚上好{:4_187:}

马黑黑 发表于 2024-9-22 22:56

艳丽

醉美水芙蓉 发表于 2024-9-22 23:51

马黑黑 发表于 2024-9-22 22:56
艳丽

黑黑老师不知道怎么把小女孩图片变小，放在视频中间？我试着动了百分比，视频也变小了？

马黑黑 发表于 2024-9-23 12:00

醉美水芙蓉 发表于 2024-9-22 23:51
黑黑老师不知道怎么把小女孩图片变小，放在视频中间？我试着动了百分比，视频也变小了？

你用div背景图片的方式设计的，div的宽度你改改就行。

你也可以使用 img 标签布置图片，这是最简单的：

<img src="图片地址" alt="" style="position: absolute;width:400px;left: 60px;top:40px;" />

style属性里是CSS设置，绝对定位是避免它会影响其他元素布局，宽 width 在这里设置，高 height 不用设置它会根据宽度来调整自己，left和top是定位图片在帖子中的位置。

梦油 发表于 2024-9-23 14:20

醉美水芙蓉 发表于 2024-9-22 21:17
梦油老师国庆节快乐！

你制作的作品大都很细腻，很精巧。

梦江南 发表于 2024-9-23 15:32

欣赏老师佳作，祝国庆快乐！

小辣椒 发表于 2024-9-23 20:04

欣赏水芙蓉精彩制作{:4_199:}

醉美水芙蓉 发表于 2024-9-23 20:33

梦江南 发表于 2024-9-23 15:32
欣赏老师佳作，祝国庆快乐！

谢谢老师光临！祝国庆节快乐！

醉美水芙蓉 发表于 2024-9-23 20:34

小辣椒 发表于 2024-9-23 20:04
欣赏水芙蓉精彩制作

谢谢小辣椒光临！祝国庆节快乐！
页: [1]
查看完整版本: 庆祝国庆！祝论坛朋友国庆节快乐！