网站首页 > 知识剖析 正文
- 可替换元素replaced element也称作可置换元素,其展现效果不是由CSS来控制的,这些元素是一种外部对象,它们外观的渲染,是独立于CSS的。
- 非置换元素non-replaced element也称作非替换元素,其内容由CSS渲染直接表现给客户端。
可替换元素
- 一个内容不受CSS渲染控制,CSS渲染模型并不考虑对此内容的渲染,且元素本身一般拥有固有尺寸例如宽度、高度、宽高比等的元素,被称之为置换元素。对于可替换元素,浏览器会根据元素的标签和属性,来决定元素的具体显示内容。
- 可替换元素的内容不受当前文档的样式的影响,CSS可以影响可替换元素的位置,但不会影响到可替换元素自身的内容。对于某些可替换元素,例如<iframe>元素,可能具有自己的样式表,但它们不会继承父文档的样式。
- CSS能对可替换元素产生的唯一影响在于,部分属性支持控制元素内容在其框中的位置或定位方式。CSS在某些情况下会对可替换元素做一些特殊处理,比如计算外边距margin和一些auto的具体值。一部分可替换元素,其本身具有的尺寸和基线baseline会被一些CSS属性用到,加入计算之中,例如vertical-align,只有可替换元素才能具有这种自带值。
- 例如浏览器会根据<img>标签的src属性的值来读取图片信息并显示出来,图片的内容由src决定,CSS并不考虑对图片的内容进行渲染。又例如根据<input>标签的type属性来决定是显示输入框,还是单选按钮等。
- 常见的可替换元素,例如<iframe>、<video>、<embed>、<img>等,有些元素在特定情况下会被当作可替换元素处理,例如<option>、<audio>、<canvas>、<object>、<applet>、<input>等。
非替换元素
非替换元素是其内容包含在文档中的元素,其内容可以受CSS渲染控制。
猜你喜欢
- 2024-11-23 Python的selenium实现等待某个元素加载完成后返回结果
- 2024-11-23 DOM 操作之DOM概念和获取元素
- 2024-11-23 html 哪些是块级元素、哪些是行内元素?
- 2024-11-23 小白总结:前端HTML基础知识点(1)——元素总结
- 2024-11-23 HTML Video 元素在 Vue 中消失的 muted 属性
- 2024-11-23 用CSS 实现元素垂直居中,有哪些好的方案?
- 2024-11-23 JavaScript知识点总结(7)
- 2024-11-23 Java 0基础入门 (Html表单、表单元素)
- 2024-11-23 《css大法》之使用伪元素实现超实用的图标库
- 2024-11-23 聊聊 CSS 隐藏元素的 10 种实用方法
- 最近发表
- 标签列表
-
- xml (46)
- css animation (57)
- array_slice (60)
- htmlspecialchars (54)
- position: absolute (54)
- datediff函数 (47)
- array_pop (49)
- jsmap (52)
- toggleclass (43)
- console.time (63)
- .sql (41)
- ahref (40)
- js json.parse (59)
- html复选框 (60)
- css 透明 (44)
- css 颜色 (47)
- php replace (41)
- css nth-child (48)
- min-height (40)
- xml schema (44)
- css 最后一个元素 (46)
- location.origin (44)
- table border (49)
- html tr (40)
- video controls (49)