本帖最后由 花简静 于 2024-8-18 15:24 编辑
<style>
#papa {
margin: 130px 0 0 calc(50% - 931px);
position: relative;
display: grid;
place-items: center;
width: 1700px;
height: 900px;
background: url('https://642303.freep.cn/642303/tu/0505qqqg01.webp');
box-shadow: 3px 3px 20px #000;
z-index: 1;
overflow: hidden;
}
.bgpic {
position: absolute;
width: 1700px;
left: 0;
bottom: 0PX;
opacity: .16;
content: url('https://pic.imgdb.cn/item/658f8197c458853aefde5b4c.png');
}
.bgpic:nth-of-type(2) {
left: 0px;
top: 0PX;
opacity: .26;
}
#vid {
position: absolute;
width: 120%;
height: 100%;
top:-110px;
left:-120px;
mix-blend-mode: screen;
object-fit: cover;
opacity: .26;
pointer-events: none;
}
</style>
<div id="papa">
<div class="bgpic"></div>
<div class="bgpic"></div>
<div class="bgpic"></div>
<div class="bgpic"></div>
<video id="vid" src="https://img.tukuppt.com/video_show/2405179/00/02/37/5b5ae2efb2359.mp4" autoplay loop muted></video>
</div>
<script>
const sf = document.createElement('script');
sf.src = 'https://638183.freep.cn/638183/web/api/mplayer.js';
sf.charset = 'utf-8';
document.body.appendChild(sf);
sf.onload = () => {
const myplayer = new mPlayer();
myplayer.setAudSrc('https://music.163.com/song/media/outer/url?id=28160231');
myplayer.setBtnCss(`
background: url('https://pic.imgdb.cn/item/658f974ac458853aef249938.gif') no-repeat center/cover;
width: 200px;
height: 200px;
bottom: 100px;
mix-blend-mode: screen;
opacity: .96;
left:300px;
`);
myplayer.setLrcCss('bottom: -30px;opacity: .86; font-size: 26px;--bg: linear-gradient(rgba(250,250,250,.25),rgba(175,238,238,.65)); color: #fff;');
myplayer.lrcAr= [
[0.63," ",0.6],];
};
</script>
| 
