6.CSS串接

网络整理 - 07-27
屏幕就是一个战场,在一个HTML文件中, 如果有3种不同的css样式表规则都使用P作 为其选择。输入的样式表指示浏览器将 <P>文字用红色显示,而植入的样式表指 示浏览器用蓝色显示,而行内样式表指 示浏览器用黄色。 那么可怜的浏览器该听谁的呢? 好在支持样式表的浏览器自身配有样式 表的串接顺序来应付这种情形。总有几 种样式表规则要比其它的规则更重要。 根据正式的规定,以下为样式表的串接 顺序:

浏览器将按照上述顺序执行样式表的指 令。 但是还要一个问题。如果同一种类的多 个规则相互冲突怎么办?比如,如果一 项植入样式表规则将<P>以绿色显示,而 另一个规则要求以红色显示? 多亏聪明的样式表标准的发明人,对于这 种冲突也有一个顺序,但很复杂。这里 有一个极其简单的解决顺序:

  • 使用特别说明的样式表规则,例:

    BODY { color: green } P { color: red }

    有一项规则特别说明<P> 中的文字 一红色显示,但它同时也继承了 <BODY>的绿色规定。但是特别说明 了的规则的重要性要大于继承的规 则,所以<P>之内的文字一红色显 示。

  • 应用继承的样式表规则

    如果不存在第1步中所列的特别说明 的规则(比如存在特别说明了的多 项规则),则浏览器转向执行继承 的规则。如果找不到继承的规则, 则浏览器转向执行第3步。

  • 按照样式表规则在HTML中的显示 顺序执行。

    P { color: green } P { color: red }

    当无法适用上述规则时,浏览器将 根据规则在代码中显示顺序执行。 在上例中,<P>作为讲座一红色显示, 因为它是最后给出的规则。

  • 注意:正式的串接样式表规定对于串接 顺序有更详细的规定。但由于执行规定Netscape Communicator 和Internet Explorer都不支持,所以本文中不再细 述。 最后一个问题:如果样式表规则同HTML 标签冲突时,如何处理?我们看一下这 个例子:

    I { font-family: impact }

    <P>I think <I><FONT FACE="Times"> East of Eden</FONT></I> is Stein beck's best novel.</P>

    该例中样式表规则要求浏览器使用 Impact,但是传统的HTML<FONT FACE>标 签要求用Times字体,一个很明显的传统。 根据正式的样式表规定,应该优先执行样 式表规则。 但是最主要的几种浏览器Netscape 和IE 4.0 都规定应优先执行HTML。唉....... 你看到了吧,浏览器不能如我们希望的 那样应用串接样式表。节哀顺变吧。

    返回本专题:《CSS层叠样式表教程》的目录