来看拳击赛（学习黑黑湖心亭效果）
<style>
.papa { margin: 70px 0 0 calc(50% - 681px); width: 1200px; height: 640px; background: url('https://pic.imgdb.cn/item/65be37ef871b83018af2effc.jpg') no-repeat center/cover; box-shadow: 3px 3px 20px #000; overflow: hidden; position: relative; z-index: 1; }
#btnplay { position: absolute; left: calc(50% - 80px); top: 20px; mix-blend-mode: normal; filter: hue-rotate(0deg); transition: filter 1s; cursor: pointer; animation: rot 10s linear infinite var(--state); }
#btnplay:hover { filter: hue-rotate(280deg); }
.ipic { position: absolute; bottom: 0; transform: skew(-3deg); transform-origin: bottom center; animation: skew 1s var(--delay) infinite alternate var(--state); }
.ipic:nth-of-type(1) { left: 70px; bottom: 10px; --delay: -2.5s; }
.ipic:nth-of-type(2) { left: 510px;bottom: 100px; --delay: 0s; }
.ipic:nth-of-type(3) { left: 810px; bottom: 0px; --delay: -1.5s; }
#vid { position: absolute; width: 100%; height: 110%;top: -10%; opacity: 0.35; object-fit: cover; aspect-ratio: 1;pointer-events: none; mix-blend-mode: screen; }
@keyframes rot { to { transform: rotate(1turn); } }
@keyframes skew { to { transform: skew(3deg); } }
</style>
<div class="papa">
<audio src="https://music.163.com/song/media/outer/url?id=1947887656" autoplay loop></audio>
<video id="vid" src="https://img.tukuppt.com/video_show/2475824/00/01/98/5b4f6be5616e1_10s_big.mp4" autoplay loop muted oncontextmenu="return false"></video>
<img class="ipic" src="https://pic.imgdb.cn/item/65be3831871b83018af4134c.png" alt="" />
<img class="ipic" src="https://pic.imgdb.cn/item/65be3872871b83018af52c63.png" alt="" />
<img class="ipic" src="https://pic.imgdb.cn/item/65be38bc871b83018af679fa.png" alt="" />
<img id="btnplay" src="https://pic.imgdb.cn/item/65be3a56871b83018afdfce2.png" alt="" title="play" />
</div>
<script>
var sf = document.createElement('script');
sf.charset = 'utf-8';
sf.src = 'https://638183.freep.cn/638183/web/js/mpku_simple.js';
document.querySelector('body').appendChild(sf);
</script> 红影 发表于 2024-2-3 22:04
谢谢黑黑鼓励，只要没破坏原本的高雅就好
这怎么会呢。工厂做出一个产品，比如刀吧，有人拿去杀猪，有人用来做艺术品收藏，都很正常 休息天，看看多个选手的拳击{:4_173:} 黑黑那么雅致的荷花漂浮，被我弄成了狂霸的。不好意思@马黑黑 {:4_170:} 红影 发表于 2024-2-3 21:17
黑黑那么雅致的荷花漂浮，被我弄成了狂霸的。不好意思@马黑黑
荷花也有战斗时 马黑黑 发表于 2024-2-3 21:26
荷花也有战斗时
谢谢黑黑鼓励，只要没破坏原本的高雅就好{:4_173:} 我在高中的时候练过拳击，很刺激。 这个精彩 全民健身开始{:4_187:} 红影 发表于 2024-2-3 21:17
黑黑那么雅致的荷花漂浮，被我弄成了狂霸的。不好意思@马黑黑
红影你太可爱了{:4_173:}各有特色 代码制作太好玩了{:4_173:} 马黑黑 发表于 2024-2-3 22:26
这怎么会呢。工厂做出一个产品，比如刀吧，有人拿去杀猪，有人用来做艺术品收藏，都很正常
这个帖子里正好是反的，你的刀变成了精美的艺术品，我的成了杀猪的{:4_173:} 梦油 发表于 2024-2-4 11:12
我在高中的时候练过拳击，很刺激。
梦油厉害。我读书时，有个留学生黑人说，没打过拳击的男人不算男人{:4_173:} 亲爱的，这个创意特别棒，这个效果用这个场景太合适了{:4_199:} 亲爱的，脑子特别的灵，这个效果绝对聪明的设计，完美{:4_178:} 菲儿 发表于 2024-2-4 11:12
这个精彩 全民健身开始
全民估计不行，没训练过的上去就被打趴了{:4_170:} 菲儿 发表于 2024-2-4 11:13
红影你太可爱了各有特色
谢谢菲儿{:4_187:} 菲儿 发表于 2024-2-4 11:14
代码制作太好玩了
是啊，这些都能用代码实现，我也觉得挺神奇的{:4_173:} 小辣椒 发表于 2024-2-4 19:31
亲爱的，这个创意特别棒，这个效果用这个场景太合适了
是黑黑的倾斜效果好，无论是用来做花木的摇曳还是做人物，都很合适呢{:4_187:} 小辣椒 发表于 2024-2-4 19:32
亲爱的，脑子特别的灵，这个效果绝对聪明的设计，完美
谢谢亲爱的夸奖鼓励{:4_185:} 红影 发表于 2024-2-4 19:24
这个帖子里正好是反的，你的刀变成了精美的艺术品，我的成了杀猪的
那敢情好