替换元素

经典真题

• 什么是可替换元素，什么是非可替换元素，它们各自有什么特点？

什么是替换元素

所谓可替换元素（replaced element），是指一些展现效果不由 CSS 来控制的元素。这些元素是一种外部对象，它们外观的渲染，是独立于 CSS 的。

简单来说，它们的内容不受当前文档的样式的影响。CSS 可以影响可替换元素的位置，但不会影响到可替换元素自身的内容。某些可替换元素，例如 <iframe> 元素，可能具有自己的样式表，但它们不会继承父文档的样式。

与替换元素相对应的，就是非替换元素，顾名思义就是那些样式完全由 CSS 来控制的元素，例如 p，h1～h6 等。

更多可替换元素内容可以参阅 MDN：https://developer.mozilla.org/zh-CN/docs/Web/CSS/Replaced_element

常见的替换元素

• 图片标签 img
• 内联框架 iframe
• 音频视频标签

真题解答

• 什么是可替换元素，什么是非可替换元素，它们各自有什么特点？

可替换元素是指这样一种元素，它在页面中的大部分展现效果不由 CSS 决定。

比如 img 元素就是一个可替换元素，它在页面中显示出的效果主要取决于你连接的是什么图片，图片是什么它就展示什么，CSS 虽然可以控制图片的尺寸位置，但永远无法控制图片本身。

再比如，select 元素也是一个典型的可替换元素，它在页面上呈现的是用户操作系统上的下拉列表样式，因此，它的展现效果是由操作系统决定的。所以，同一个 select 元素，放到不同操作系统的电脑上会呈现不同的外观。

img、video、audio、大部分表单元素都属于可替换元素。

非可替换元素就是指的普通元素，它具体在页面上呈现什么，完全由 CSS 来决定。

-EOF-