css元素显示模式
元素显示模式分为:块级元素、行内元素以及块级行内元素
块级元素
代表元素: div、h1-h6、 p…..
- 块级元素独占一行
- 块级元素可以设置元素的宽高,如果没有设置,默认为父级元素的宽高
- 块级元素内可以插入其它块级元素以及行内元素
注意:
p标签内不能插入div标签
行内元素
代表元素:span、a…..
- 行内元素可以并列在一行
- 行内元素不能直接设置宽高,默认的宽是里面包含内容的长度
- 行内元素里面只能插入行内元素
注意
a标签内可以插入块级元素
块级行内元素
既具有块级元素的特点也具有行内元素的特点,代表元素:img、input、td…
- 一行可以排列多个,但之间会留有缝隙
- 默认宽度是里面包含类容的长度
- 可以设置宽高、内外边距
元素显示模式的转换
行内元素 、 块级元素、行内块元素的相互转换,使其拥有其它显示模式的特性
display:block; //可以将元素转换成块级元素
dispaly:inline;//将元素转换成行内元素
dispaly:inline-block;//将元素转换成行内块元素