多重样式

vicky.yu

如果某些属性在不同的样式表中被同样的选择器定义，那么属性值将从更具体的样式表中被继承过来。

例如，外部样式表拥有针对 H3 选择器的三个属性：

h3      

{        

color:red;        

text-align:left;     

font-size:8pt;   

}

而内部样式表拥有针对 H3 选择器的两个属性：

h3      

{        

text-align:right;        

font-size:20pt;     

}

假如拥有内部样式表的这个页面同时与外部样式表链接，那么 H3 得到的样式是：

color:red; text-align:right;        

font-size:20pt;

即颜色属性将被继承于外部样式表，而文字排列（text-alignment）和字体尺寸（font-size）会被内部样式表中的规则取代。

多重样式将层叠为一个
样式表允许以多种方式规定样式信息。样式可以规定在单个的 HTML 元素中，在 HTML 页的头元素中，或在一个外部的 CSS 文件中。甚至可以在同一个 HTML 文档内部引用多个外部样式表。

层叠次序
当同一个 HTML 元素被不止一个样式定义时，会使用哪个样式呢？

一般而言，所有的样式会根据下面的规则层叠于一个新的虚拟样式表中，其中数字 4 拥有最高的优先权。

浏览器缺省设置
外部样式表
内部样式表（位于 head 标签内部）
内联样式（在 HTML 元素内部）
因此，内联样式（在 HTML 元素内部）拥有最高的优先权，这意味着它将优先于以下的样式声明： 标签中的样式声明，外部样式表中的样式声明，或者浏览器中的样式声明（缺省值）。

Remark 提示:如果你使用了外部文件的样式在内部样式中也定义了该样式，则内部样式表会取代外部文件的样式。