标签的分类

Posted 2020-08-06

•标签元素分类

•块级元素block;  div p h1-h6 table form…

•内联元素inline; a span …

•内联块inline-block; img input select…

 

块级元素标签的特点

1、独占一行，默认情况下，其宽度自动填满其父元素宽度

2、可以设置宽和高，设置了宽度还是独占一行

3、可以设置margin和padding属性

4、对应的相关display属性:block

5、可以互相转换display:inline变成行内元素

6、可以嵌套块级元素及行内元素

 

内联元素标签的特点

1、不会独占一行，相邻行内元素会排列在同一行里，直到一行排不下，才会换行，其宽度随元素的内容而变化

2、不可以设置宽和高，设置了宽度还是独占一行

3、水平方向的内外都产生边距效果但竖直方向的内外边距却不会产生边距效果

4、对应的相关display属性:inline

5、可以互相转换display:block变成行块级元素

6、不可以嵌套块级元素

 

标签嵌套规则

 

1、不能交叉嵌套

 

2、块级元素嵌套行内元素或者块级元素

 

3、行内元素不能嵌套块级元素

 

4、块级元素不能放在<p>里面

 

5、有几个特殊的块级元素只能包含内嵌元素，不能再包含块级元素，这几个特殊的标签是：

h1、h2、h3、h4、h5、h6、p、dt