CSS定义中的display属性,封装了显示类型这个概念。所谓的显示类型,就是将浏览器如何计算面积、如何计算位置等的规则,整合成一组计算规则,这样的一组计算规则就称为显示类型。在浏览器上运行网页时,网页文件里每个标签依照标签类型的不同,都会有一个预设的显示类型。浏览器在做显示运算的时候,会依照每个标签的显示类型,来计算标签在浏览器上应该显示的大小与位置。
1.block显示类型:在流动定位中,直接占据一行的配置空间;
使用CSS定义的高度样式、宽度样式来计算矩形对象大小,不会依照内容来计算大小;
当没有定义或是定义的宽度样式、margin属性等,无法填满配置空间时,由浏览器参考这些央视的内容,自动配置矩形对象的外边距、内容区域,来填满配置空间;
在HTML标签的定义中,p标签、div标签等标签的display属性,都是预设为block显示类型。
2.inline显示类型:在流动定位中,依照流动定位的规则来配置定位;
忽略CSS定义高度样式、宽度样式来计算矩形对象大小,而是依照内容来计算大小;
在HTML标签的定义中,a标签、input标签等标签的display属性,都是预设为inline显示类型。
3. inline-block显示类型:在流动定位中,依照流动定位的规则来配置定位;
使用CSS定义高度样式、宽度样式来计算矩形对象大小;没有定义时则依照内容来计算大小。
这些设置都可以强行设置,例如给div设为display:inline;等~~~