微信公众号
扫描关注微信公众号
博客大厅

HTML 中的空元素有哪些?

原创 来源:博客站 阅读 0 03月21日 06:55 听全文

在 HTML 中,**空元素(Void Elements)**是指那些没有闭合标签且不能包含内容的元素。这些元素通常用于插入特定的内容或功能,如图像、换行、水平线等。空元素在 HTML5 中不需要自闭合(即不需要在末尾添加 /),但在 XHTML 中需要自闭合。

常见的空元素:

  1. <br>:插入换行。
  2. <hr>:插入水平线。
  3. <img>:插入图像。
  4. <input>:创建输入字段。
  5. <meta>:定义文档的元数据。
  6. <link>:定义文档与外部资源的关系,如样式表。
  7. <area>:定义图像映射中的可点击区域。
  8. <base>:指定文档中所有相对 URL 的基准 URL。
  9. <col>:定义表格列的属性。
  10. <embed>:嵌入外部内容,如插件。
  11. <param>:定义对象的参数(通常与 <object> 标签一起使用)。
  12. <source>:为媒体元素(如 <audio><video>)指定媒体资源。
  13. <track>:为媒体元素指定文本轨道(如字幕)。

示例代码:

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>空元素示例</title>
    <link rel="stylesheet" href="styles.css">
    <base href="https://example.com/">
</head>
<body>
    <h1>空元素示例</h1>
    <p>这是一个段落。<br>这是换行后的文本。</p>
    <hr>
    <img src="image.jpg" alt="示例图片">
    
    <form action="/submit" method="post">
        <label for="name">姓名:</label>
        <input type="text" id="name" name="name">
        <input type="submit" value="提交">
    </form>

    <audio controls>
        <source src="audio.mp3" type="audio/mpeg">
        <track src="subtitles.vtt" kind="subtitles" srclang="zh" label="中文">
        您的浏览器不支持音频元素。
    </audio>
</body>
</html>

示例解析:

  • <br>:在段落中插入换行。
  • <hr>:在页面中插入水平线。
  • <img>:插入图像,src 属性指定图像路径,alt 属性提供替代文本。
  • <input>:创建文本输入字段和提交按钮。
  • <meta>:指定文档的字符编码为 UTF-8。
  • <link>:引入外部样式表。
  • <base>:指定文档中所有相对 URL 的基准 URL。
  • <source>:为 <audio> 元素指定音频资源。
  • <track>:为 <audio> 元素指定字幕轨道。

总结:

  • 空元素是没有闭合标签且不能包含内容的 HTML 元素。
  • 常见的空元素包括 <br><hr><img><input><meta><link> 等。
  • 在 HTML5 中,空元素不需要自闭合,但在 XHTML 中需要自闭合(如 <br />)。
学在每日,进无止境!更多精彩内容请关注微信公众号。
原文出处: 内容由AI生成仅供参考,请勿使用于商业用途。如若转载请注明原文及出处。
出处地址:http://www.07sucai.com/tech/794.html
版权声明:本文来源地址若非本站均为转载,若侵害到您的权利,请及时联系我们,我们会在第一时间进行处理。
轻松 一刻
>