空元素&可替代元素

空元素(empty element)

空元素,可能是 HTML,SVG,或者 MathML 里的一个不存在子节点(例如内嵌的元素或者元素内的文本)的element。但是空元素可以有自己的属性,要区分属性和节点。

空元素中嵌套子节点是没有语义含义的。

空元素一般是没有闭合标签的,如果空元素使用了闭合标签,例如:<input></input> ,那么一般这个标签就会变得无效。

常见的空元素:

  • <area>
  • <base>
  • <br>
  • <col>
  • <colgroup> when the span is present
  • <command>
  • <embed>
  • <hr>
  • <img>
  • <input>
  • <keygen>
  • <link>
  • <meta>
  • <param>
  • <source>
  • <track>
  • <wbr>

可替代元素(replaced element)

可替换元素的展现效果不是由 CSS 来控制的。这些元素是一种外部对象,它们外观的渲染,是独立于当前文档使用的 CSS样式 的。一般来说当前文档的CSS样式唯一能够控制的是可替代元素在当前文档的位置。

常见的可替换元素:

典型的可替换元素

  • <iframe>
  • <video>
  • <embed>
  • <img>

特定情况下的可替换元素

  • <option>
  • <audio>
  • <canvas>
  • <object>
  • <applet>

<input>
<input>在type为image的情况下可以像<img>一样被当做可替换元素,但是其他type类型下,被明确地列为非可替换元素。

CSS 中的 content
用 CSS content 属性插入的对象是匿名的可替换元素。它们并不存在于 HTML 标记中,因此是“匿名的”。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,680评论 1 92
  •   DOM(文档对象模型)是针对 HTML 和 XML 文档的一个 API(应用程序编程接口)。   DOM 描绘...
    霜天晓阅读 9,067评论 0 7
  •   DOM 1 级主要定义的是 HTML 和 XML 文档的底层结构。   DOM2 和 DOM3 级则在这个结构...
    霜天晓阅读 5,356评论 1 3
  • Element对象对应网页的HTML标签元素。每一个HTML标签元素,在DOM树上都会转化成一个Element节点...
    许先生__阅读 5,831评论 0 2
  • 第3章 基本概念 3.1 语法 3.2 关键字和保留字 3.3 变量 3.4 数据类型 5种简单数据类型:Unde...
    RickCole阅读 10,632评论 0 21