行内元素和块级元素详解

Posted 2020-09-26

行内元素和块级元素，一般大家都这嘛说，其实有好多细节呢。你造吗？

一、块级元素和块元素：

1.块级元素是那些视觉上会被格式化成块状的元素，通俗一点来说就是那些会换新行的元素。display 属性的：block, list-item, table, flex, grid 值都可以将一个元素设置成块级元素 

2.块元素是 display 属性值为 block 的元素，它应该是 块级元素 的一个子集，而不是等同的，一个 块元素 是一个 块级元素，但一个 块级元素 不一定是一个 块元素。

二、行内元素和行内级元素：

1.行内级元素是那些不会为自身内容形成新的块，而让内容分布在多行中的元素。display 属性的：inline, inline-table, inline-block, inline-flex, inline-grid 值都可以将一个元素设置成行内级元素。

2.如同块元素之于块级元素的关系，行内元素仅仅是 display 属性值为 inline 的元素。

具体内容详见http://blog.doyoe.com/2015/03/09/css/%E8%A7%86%E8%A7%89%E6%A0%BC%E5%BC%8F%E5%8C%96%E6%A8%A1%E5%9E%8B%E4%B8%AD%E7%9A%84%E5%90%84%E7%A7%8D%E6%A1%86/?utm_source=caibaojian.com#block-level-element