Css学习——HTML元素类型分类；

最近学习了CSS元素类型分类：

根据CSS显示分类，HTML主要分为：块状元素、 内联元素；

其中，这么分类是因为它们各自有着鲜明的特点：

1.块状元素特点： ​

(1)正如其名字一样，块状元素在网页中默认以矩形区域显示，即块状； ​

(2)默认情况下，其在网页中不会出现并行排布的情况，即独占一行（图1）；​

(3)可以直接添加宽高； ​

(4)一般情况下，作为其他元素或内容的容器；

 

 

 　　 图1 p标签

2.内联元素特点： ​

(1)内联元素其实是没有具体的形状的，因为其并不能设置宽高，但其在页面中最小单位也是矩形； ​

(2)与块状元素不同，内联元素默认为行内逐个显示（图2）； ​  ​

(3)内联元素也符合盒模型的规则，但是个别属性会出现问题；

 

 

 　　　　图2 span标签

就像事情永远不是非黑即白一样，元素也是,有一些元素，他们很难归类在这两者之间:

这里又分为两类：可变元素、行内块元素；

1. 可变元素：它们可通过display属性来改变默认的显示类型；当属性值为block时会转化为块状元素，拥有块状元素的特点，当属性值为inline时，为内联元素，拥有内联元素的特点；（还有一些其他属性值）
2. 行内块元素：这些元素既拥有块状元素的特点，又拥有内联元素的特点；

 (1)可以设置宽高；

 (2)在一行内逐个显示；

 Display:inline-block;  

 

总的来说，元素类型分为三类，块状元素、内联元素，第三种颇有争议，行内块元素或可变元素。