CSS块状元素、内联元素和内联块状元素

CSS块状元素、内联元素和内联块状元素

块状元素

1、分类

div p h1…h6 ol ul table等

2、特点

• 块状元素都是从新的一行开始的
• 元素的高宽、行高以及顶部和底边距均可设置
• 元素宽度不设置时，宽度是他本身父容器的额100%

3、将内联元素转为块状元素

a{display: block;}

内联元素

1、分类

a span br i等

2、特点

• 内联元素和其他元素处于同一行
• 元素的高宽、行高以及顶部和底边距不可设置
• 元素宽度是他包含的文字或图片的宽度，不可设置

3、将块状元素转为内联元素

div{display: inline;}

内联块状元素

1、分类

img input

2、特点

• 和其他元素在同一行上
• 元素的高宽、行高以及顶部和底边距均可设置

3、将元素转为内联块状元素

div{display: inline-block;}