前端面试八股文每日一题——CSS

块级元素、行内元素、行内块元素的区别？

答：

• 块级元素（block）：自动占据一行，可以设置宽高，margin/padding水平垂直方向都有效，能容纳其他块级元素或行内元素。常见的有div，p，h1~h6，ul，li，form，table。

• 行内元素（inline）：占据一行的一小部分，多个行内元素水平排版，无法设置宽高，margin在垂直方向上无效，padding在水平垂直方向上都有效，只能容纳文本或其他行内元素。常见的有span，img，a。

• 行内块元素（inline-block）：跟行内元素类似，区别是可以设置宽高，margin/padding水平垂直方向都有效。常见的有button，img，input，select，label，textarea。

img是可替换元素。

在CSS中，可替换元素的展现效果不是由CSS来控制的。是一种外部对象，它们外观的渲染，是独立于CSS的。例如iframe元素，可能具有自己的样式表，但它们不会继承父文档的样式。典型的可替换元素有：iframe、video、embed、img。