HTML5网页标签介绍

HTML5是HTML的最新标准，它在HTML4和XHTML基础上进行了改进，引入了新的元素和功能，以便更好地支持网页内容的创建。以下是一些常用的HTML5元素：

!DOCTYPE: 声明文档类型。




<!DOCTYPE html>

<html>: 定义整个网页。




<html>
...
</html>

<head>: 包含文档的元数据。




<head>
  <title>页面标题</title>
</head>

<body>: 包含可见的页面内容。




<body>
  <p>这是一个段落。</p>
</body>

<header>: 定义页面或区段的头部。




<header>
  <h1>网站标题</h1>
</header>

<nav>: 定义导航链接。




<nav>
  <ul>
    <li><a href="index.html">主页</a></li>
    <li><a href="contact.html">联系我们</a></li>
  </ul>
</nav>

<section>: 定义文档中的一个区段。




<section>
  <h2>区段标题</h2>
  <p>区段内容。</p>
</section>

<article>: 定义独立的、完整的内容。




<article>
  <h2>文章标题</h2>
  <p>这是一篇文章。</p>
</article>

<aside>: 定义侧边内容，如广告、侧栏。




<aside>
  <p>侧边内容。</p>
</aside>

<footer>: 定义区段或整个文档的底部。




<footer>
  <p>版权信息</p>
</footer>

<canvas>: 绘图元素，用于绘制图形。




<canvas id="myCanvas" width="200" height="100">
  您的浏览器不支持Canvas。
</canvas>

<audio>: 音频内容。




<audio controls>
  <source src="music.mp3" type="audio/mpeg">
  您的浏览器不支持audio元素。
</audio>

<video>: 视频内容。




<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  您的浏览器不支持video元素。
</video>

<datalist>: 定义选项列表，与输入字段配合使用。




<input list="browsers" type="text" name="myBrowser">
<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

<details>: 用于描述文档或文档某个部分的细节。




<details>
  <summary>点击查看详情</summary>
  <p>这是细节内容。</p>
</details>

<progress>: 定义任何类型的任务的进度。




<progress value="22" max="100">
  已完成22%
</progress>

<time>: 定义日期或时间。




<p>我们下周

HTML5网页标签介绍

评论已关闭

推荐阅读