夜雨聆风
2026一马当先,马到成功!!附源码!!
效果展示
完整源码
<!DOCTYPE html><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width, initial-scale=1.0"><title>骏马奔腾</title><style>/* 设置body和html全屏 */html, body {margin: 0;padding: 0;height: 100%;width: 100%;overflow: hidden;}/* 背景 */.video-background {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover; /* 保持内容的比例并覆盖整个容器 */z-index: -1; /* 确保内容在最底层 */}/* 内容样式 */.content {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);color: rgb(240, 17, 155);font-size: 0.5rem;font-family: 华文彩云;animation: pulse 1.5s infinite;text-align: center;z-index: 1; /* 确保内容显示在内容之上 */}</style></head><body><!-- 背景 --><videoclass="video-background"autoplaymutedloop><sourcesrc="骏马奔腾.mp4"type="video/mp4">Your browser does not support the video tag.</video><audioid="music1"looppreload="auto"controlshidden><!-- http://music.163.com/song/media/outer/url?id=2066671178.mp3 --><!-- http://music.163.com/song/media/outer/url?id=1963443271.mp3 生日--><!-- http://music.163.com/song/media/outer/url?id=2686588663.mp3" type="audio/mpeg--><sourcesrc="http://music.163.com/song/media/outer/url?id=1963443271.mp3">Your browser does not support the audio element.</audio><script>document.body.addEventListener('click', function() {var myAudio = document.getElementById('music1');myAudio.play();});</script><!-- 页面内容 --><divclass="content"></div></body></html>
