CSS3显示类型

课后整理 2020-12-9

网页对象的显示类型可以使用display属性来显式定义。任何元素都可以通过display属性改变默认显示类型,因此也会改变该元素所对应的网页布局结构。

在CSS2.1中,display属性共有18个选项值,详细说明如下:

更详细说明可以参考CSS参考手册,CSS3新增了box显示类型,关于该技术话题请参阅下一章详细讲解。如果单从布局角度来分析,这些显示类型都可以划归为block和inline两种基本显示形态,其他类型都是这两种类型的特殊显示。其中真正能够应用并获得所有浏览器支持的取值只有4个:block、none、inline、list-item。

none属性值表示隐藏并取消盒模型,这样元素所包含的内容就不会被浏览器解析和显示,同样这个盒子所包含的任何元素都会被浏览器忽略,不管它们是否被声明为其他属性。

list-item属性值表示列表项目,其实质上也是块状显示,不过是一种特殊的块状类型,它增加了缩进和项目符号。

另外,还有一些比较有用的显示类型,如table、table-cell、inline-block、inline-table等,它们在特殊布局中具有重要的实用价值。