CSS样式中display属性用法指导

本文和大家重点讨论一下CSS display属性的使用,CSS display属性值基本上分为inline,block,和none;block元素前后换行,标题和段落元素是块元素;而none,意思不显示元素,在可用性上可以实现漂亮的效果,交替样式或hover效果的高级运用。

CSS display属性

操作HTML元素的诀窍在于明白它们工作的方法在于没有特定的形式。一些由标签组成的大部分页面可以设定任何样式。浏览器默认的样式里的大部分html元素由字体样式、margin,padding组成,本质上是显示类型。

CSS display属性基本上有inline,block,和none三个属性值。

inline就像它的本意??显示为inline的元素为行。strong,anchor锚和em强调元素默认是行。

block元素前后换行。标题和段落元素是块元素。

none,意思不显示元素,在可用性上可以实现漂亮的效果,交替样式或hover效果的高级运用。

设定表现可以更好运用在网页制作上。

h1 {  


    display: inline;  


    font-size: 2em;  


}  


#header p {  


    display: inline;  


    font-size: 0.9em;  


    padding-left: 2em;  


}  

设定标题h1为行元素,可以和后面的元素在同一行。

#navigation, #seeAlso, #comments, #standards {  


    display: none;  


}  


 

上面的代码可以使用在打印样式里,比如在导航使用,可以在打印时不显示导航这些无关紧要的东西。

相关推荐