CSS样式中的display属性学习记录

在CSS样式中，最常用到的display属性有三个，block,inlineblock,inline,分别从1.是否独占一行2.是否能设置宽高3.margin和padding是否有效。

• block属于块级 

1. 块级元素默认是独占一行的，且宽默认是父元素的100%，如果设置了宽高，依然是占据一行
2. 可以设置元素的宽高
3. 在设置外边距margin和padding时均有效

• inlineblock  行块级

1. 兼具inline的一行排列效果
2. 也有宽高设置效果
3. 在设置外边距margin和padding时均有效

• inline 行内元素

1. inline的只有一行排列效果，当内容超过一行 无法放下时，才会，排列到下一行
2. 没有有宽高设置效果，且内容有多大 就会占据多大的地方
3. 在设置外边距margin和padding时，只有左右边距有效，上下边距是无效。

注意：块级元素设置成inline inlineblock时，会产生元素的左右边距，可以在父级元素上 设置font-size:0;

	


	

	
	

		
1
		
2
		
自动填满父级内容且有设置边距
		
4
	

学习博客：

https://www.jianshu.com/p/c7e9375ba185