初夏浅吟
<style>
#mydiv { margin: 130px 0 20px calc(50% - 931px) ; width: 1600px; height: 899px; background: url('https://pic1.imgdb.cn/item/6826f7de58cb8da5c8f65d5f.jpg') no-repeat center/cover; box-shadow: 2px 2px 5px #333; overflow: hidden; z-index: 1; position: relative; }
.mama { position: absolute; left: 300px; bottom: 120px; width:80px; height: 80px; cursor: pointer; animation: rot 8s linear infinite var(--state); }
.mama:nth-of-type(2) { right: 100px; bottom: 220px;}
e-son { position: absolute; left: calc(50% - 2.5px); top:6px; width: 20px; height: 30px; border-radius: 50% 50%; border: 0px solid snow; transform-origin: 50% 100%; transform: rotate(var(--deg)) translateY(-10px); background: hsla(var(--bg), 100%, 50%, .23); }
#vid { position: absolute; bottom: 0; width:100%; height: calc(100% + 80px); object-fit: cover; mix-blend-mode: screen; opacity: .68;}
@keyframes rot { to { transform: rotate(360deg); } }
</style>
<div id="mydiv">
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=1419613545" autoplay="" loop=""></audio>
<video id="vid" src="https://img.tukuppt.com/video_show/6181262/01/28/52/6291f4dfd1ef7.mp4" muted="muted" autoplay="autoplay" loop="loop"></video>
<div class="mama" id="ma"></div>
</div>
<br><br><br><br><br><br><br>
页:
[1]