替换元素

在 CSS 中，**替换元素** 是一个其表示形式超出 CSS 范围的元素；它们是外部对象，其表示形式独立于 CSS 格式化模型。

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

CSS 对替换元素的唯一其他影响是，有一些属性支持控制元素内容在其框内的定位。有关更多信息，请参阅控制内容框内的对象位置。

典型的替换元素是

某些元素仅在特定情况下被视为替换元素

HTML 规范还指出，<input> 元素可以被替换，因为类型为 "image" 的 <input> 元素与 <img> 类似，是替换元素。但是，其他表单控件（包括其他类型的 <input> 元素）被明确列为非替换元素（规范使用术语“Widgets”描述其默认的平台特定渲染）。

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

使用 CSS 处理替换元素

CSS 在某些情况下专门处理替换元素，例如计算外边距和某些 auto 值时。

请注意，并非所有替换元素都具有内在尺寸或定义的基线，但有些具有，这些尺寸或基线由某些 CSS 属性（例如 vertical-align）使用。只有替换元素才能具有内在尺寸。

某些 CSS 属性可用于指定包含在替换元素中的对象应如何在元素的框区域内定位。这些由 CSS 图像规范定义

object-fit: 指定替换元素的内容对象应如何适应包含元素的框。object-fit 属性对 <iframe>、<embed> 和 <fencedframe> 元素没有影响。
object-position: 指定替换元素的内容对象在元素的框内的对齐方式。