一个HTML5多媒体特性，多媒体的格式和浏览器的支持情况！！！这是非常多的代码构成的文章，长文预警！！

最新推荐文章于 2026-04-06 19:41:28 发布

原创

最新推荐文章于 2026-04-06 19:41:28 发布 · 727 阅读

标签

#css #html #css3 #html5 #前端

本文探讨了HTML5的多媒体特性，强调在编写代码前理解其结构和组成的重要性。文章介绍了CSS代码组成，并提供了相关效果图，旨在帮助读者更好地理解和应用HTML5多媒体。别忘了点赞，一起在前端开发路上前进！

在搞代码之前，想搞清楚他的结构和组成！！！

I want to understand the structure and composition of the code before I do it
一定要了解清楚之后再去书写！码代码，不然的话，就会出现自己都看不懂代码情况，好了，话不多说，直接上代码!
Be sure to understand before you write! Code code, otherwise, there will be their own do not understand the code, well, do not say more, directly on the code

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>浮动的城市？</title>
<link href="作业二.css" type="text/css" rel="stylesheet">
</head>

<body>
<header>
  <ul>
    <a href="#">
    <li>娱乐</li>
    </a> <a href="#">
    <li>搞笑</li>
    </a> <a href="#">
    <li>时尚</li>
    </a> <a href="#">
    <li>原创</li>
    </a> <a href="#">
    <li>游戏</li>
    </a> <a href="#">
    <li>生活</li>
    </a> <a href="#">
    <li>汽车</li>
    </a> <a href="#">
    <li>动漫</li>
    </a>
  </ul>
</header>
<div>
  <p>正在播放：流动的城市</p>
  <video src="实训27：阶段测试二/实训29给学生/video/gn.webm" controls autoplay loop></video>
  <audio src="微微 - 傅如乔.mp3" autoplay loop></audio>
</div>
<div>
  <p>视频播放列表:</p>
  <ul>
    <li></li>
    <li class="one"></li>
    <li></li>
    <li></li>
  </ul>
</div>
</body>
</html>