【黑师代码】忽晚（学习黑师20250330《千年泪》三合一竖版歌词效果）
本帖最后由 花飞飞 于 2025-4-1 20:03 编辑 <br /><br /><style>@import 'https://638183.freep.cn/638183/web/ku/hcplayer3in1.css?v=1';
#tz {width: 1700px;height: 1100px; background: #e6e6e6 url('https://642303.freep.cn/642303/tu/20250331HW.webp') no-repeat center/cover; }
#lrcDiv { writing-mode: vertical-rl; left: 26%; top: 32%;color: #bfa36f; --hlcolor: #dfcea8; }
#lrcDiv > p.hlight {font-size: 20px;}
#mplayer { bottom: 30px; --track: #116a62; --prog: #bfa36f; }
#fsbtn { top: 40px; color: #116a62; border-color: #116a62; }
#playimg:hover { filter: unset; width: 150px; }
.vid { opacity: 0.65;width: 100%;height: 110%; top:-100px;}
</style>
<div id="tz" class="pa">
<video class="vid" src="https://img.tukuppt.com/video_show/15653652/00/79/86/60c98c8146068.mp4" autoplay loop></video>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=2053172248" autoplay loop></audio>
</div>
<script type="module">
import { hcplay } from 'https://638183.freep.cn/638183/web/ku/hcplayer3in1.js?v=1';
const xCenter = (el) => {
const rt = el.getBoundingClientRect();
const ww = window.innerWidth;
const ox = (ww - rt.width) / 2 - rt.left;
el.style.transform = `translateX(${ox}px)`;
};
xCenter(tz);
var gc= `
单曲：忽晚
歌手：尹昔眠
所属专辑：忽晚
作词 : 沈秋离
作曲 : 爱写歌的小田
编曲 : 爱写歌的小田
制作人 : 爱写歌的小田
学习黑师0329《千年泪》
三合一竖版歌词效果
流年如梦 恍惚间错落
梦醒依稀听见你轻唤我
停扁舟上楼阁
看山色 如水墨
枫染红满川的渔火
涟漪轻摇相思染琴瑟
烟雨中回首谁是孤独客
落木声声萧索
沉入无边暮色
你是岁月凋零的诺
你是月色 你是星河
终将 归还给日落
烙我心河从此山高海阔
你是因果 你是揣测
你是 可遇不可说
夜来风雨敲响离歌
涟漪轻摇 相思染琴瑟
烟雨中回首谁是孤独客
落木声声萧索
沉入无边暮色
你是岁月凋零的诺
你是月色 你是星河
终将归还给日落
烙我心河从此 山高海阔
你是因果 你是揣测
你是 可遇不可说
夜来风雨敲响离歌
你是月色 你是星河
终将 归还给日落
烙我心河从此山高海阔
你是因果 你是揣测
你是 可遇不可说
夜来风雨敲响离歌
夜来风雨敲响离歌
`;
hcplay(tz,gc,7);
playimg.onclick = () => aud.paused ? aud.play() : aud.pause();
</script>
@马黑黑 交一份竖版歌词作业。。
高亮的字体由原来26调成了20，感觉在这里比较合适{:4_173:} 花飞飞 发表于 2025-4-1 19:23
@马黑黑 交一份竖版歌词作业。。
高亮的字体由原来26调成了20，感觉在这里比较合适
主要是还有木有叠字 刚编辑修改用上了新的居中方式，完美。。。根本不用考虑宽度了。{:4_170:} 帖子用色干净、清爽，给人耳目一新的冲击感。赞10000个 马黑黑 发表于 2025-4-1 20:04
主要是还有木有叠字
我这台电脑看还有一个梦字跟别人叠了，上贴也是梦，这也是奇了。。那句并不长。
{:4_170:} 花飞飞 发表于 2025-4-1 20:08
我这台电脑看还有一个梦字跟别人叠了，上贴也是梦，这也是奇了。。那句并不长。
你一直没说是什么操作系统。如果是win10/11，还要看看是不是家庭版。 马黑黑 发表于 2025-4-1 20:05
帖子用色干净、清爽，给人耳目一新的冲击感。赞10000个
这俩色搭起来好象也蛮好看的嗳{:4_173:}一万赞好多，收起来攒着 花飞飞 发表于 2025-4-1 20:09
这俩色搭起来好象也蛮好看的嗳一万赞好多，收起来攒着
每一个相等于一个小金币 马黑黑 发表于 2025-4-1 20:09
你一直没说是什么操作系统。如果是win10/11，还要看看是不是家庭版。
你问了第三遍，每次都有答，奇了，坛子吃了我的回复？
我第三次答你。温10企业版。。上回激活整到2434年那个{:4_170:} 马黑黑 发表于 2025-4-1 20:12
每一个相等于一个小金币
可真对财迷的胃口。{:4_170:} 花飞飞 发表于 2025-4-1 20:19
可真对财迷的胃口。
{:4_172:} 花飞飞 发表于 2025-4-1 20:18
你问了第三遍，每次都有答，奇了，坛子吃了我的回复？
我第三次答你。温10企业版。。上回激活整到2434年 ...
有很多会错过的 马黑黑 发表于 2025-4-1 20:21
你这个形容也是的，相当于一个金币就好了，还小金币，生怕大的沉到我啊{:4_170:} 马黑黑 发表于 2025-4-1 20:21
有很多会错过的
这回总算看到了，不是家庭版。{:4_173:}
跟操作系统有关么。。怪 花飞飞 发表于 2025-4-1 20:27
这回总算看到了，不是家庭版。
跟操作系统有关么。。怪
现在我越来越确定，和某些项目被放大有关，特别是字号层面 花飞飞 发表于 2025-4-1 20:04
刚编辑修改用上了新的居中方式，完美。。。根本不用考虑宽度了。
这是实现机制之一，绝对居中，缺点是，网络有延时之时会有一个过度，所以，干脆在 #tz {} 里设置帖子元素的 transition 属性，transition: 0.3s，这也是一种美。 花飞飞 发表于 2025-4-1 20:26
你这个形容也是的，相当于一个金币就好了，还小金币，生怕大的沉到我啊
这个要考虑到 这个背影和色调很有古典的味道， 字体也设计得很有意境，很喜欢！回头我用剪映试一下这个，试试看{:4_187:}{:4_199:} 进来就觉得眼前一亮，色彩奇妙，这女子的身姿也很娇娆。
再加上飞飞的字体设计得也很浑然一体，这个制作好美啊{:4_199:}