CSS学习之第二章《选择符与结构》(4)

来源:互联网 发布:下载ppt软件 编辑:程序博客网 时间:2024/06/09 14:40

结构

上下文选择符:

格式:H1 EM{color:gray;}

在一个上下文选择符里,规则的选择符方是由两个或更多个以空格符分隔的选择符组成的。每个空格可以翻译成“在....中发现的”、“是...的一部分”、或者“它是...的后代”,但是前提是按从后至前的顺序读选择符。H1 EM可以译作“任何EM元素,它是H1元素的后代”(如果坚持要从前往后读,可以译作“任何H1包含的EM元素”)。

当然也不仅限于两个选择符,如:UL OL UL EM{color:gray},任何无序列表下的有序列表下的无序列表内的强调文本将以灰色显示。

例:一个文档左边为蓝色背景,右边为白色背景,左右各有一系列链接,但链接颜色不能设为背景色,用上下文选择符刚可以这样:

TD.sidebar{background:blue;}

TD,main-page{background:white;}

TD.sidebar A:link{color:white;}

TD,main-page A:link{color:blue;}


继承

继承是一种机制,它允许样式不仅应用于某个特定的元素,而且应用于其后代。

例:H1{color:gray;}

<H1>Meerkat<EM>Central</Em></H1>

特殊性

特殊性(specificity)描述了不同规则的相对权重。

例:.grape{color:purple;}

h1{color:red;}

<H1 CLASS="grape">Meerkat <EM>Central</EM></H1>

上例中将显示.grape的效果。

特殊性注释列表:

 H1{color: red;} /*specificity=1 */ P EM{color:purple;} /*specificity=2*/ .grape{color:purple;} /*specificity=10*/ P.bright{color:yellow;} /*specificity=11*/ P.bright  EM.dark{color:brown;} /*specificity=22*/ #id888{color:blue;} /*specificity=100*/

原创粉丝点击