七彩课堂[网页设计CSS教程系列]
继承性是层叠的另一个重要部分

关于层叠样式
术语层叠 是指浏览器最终为网页上的特定元素显示样式的方式。三种不同的源决定了网页上显示的样式:由页面的作者创建的样式表、用户的自定义样式选择(如果有)和浏览器本身的默认样式。以上主题说明作为网页及附加到该页的样式表的作者来创建网页的样式。但是,浏览器也具有它们自己的默认样式表来指定网页的呈现方式,除此之外,用户还可以通过选择来调整网页的显示对浏览器进行自定义。网页的最终外观是由所有这三种源的规则共同作用(或者“层叠”)的结果,最后以最佳方式呈现网页。
一个常见标签(段落标签,即 <p> 标签)可说明此概念。默认情况下,浏览器自带有为段落文本(即位于 HTML 代码中 <p> 标签之间的文本)定义字体和字体大小的样式表。例如在 Internet Explorer 中,包括段落文本在内的所有正文文本都默认显示为 Times New Roman 中等字体。
但是作为网页的作者,您可以为段落字体和字体大小创建能覆盖浏览器默认样式的样式表。例如,您可以在样式表中创建以下规则:
p {
font-family: Arial;
font-size: small;
}
当用户加载页面时,您作为作者创建的段落字体和字体大小设置将覆盖浏览器的默认段落文本设置。
用户可以选择以最佳方式自定义浏览器显示,以方便他们自己使用。例如在 Internet Explorer 中,如果用户认为页面字体太小,则他们可以选择“查看”>“文字大小”>“最大”将页面字体扩展到更易辨认的大小。最终(至少在这种情况下),用户的选择将覆盖段落字体大小的浏览器默认样式和网页作者创建的段落样式。
继承性是层叠的另一个重要部分。网页上大多数元素的属性都是继承而来。例如,段落标签从 body 标签中继承某些属性,项目列表标签从段落标签中继承某些属性等等。因此,如果在样式表中创建以下规则:
body {
font-family: Arial;
font-style: italic;
}
网页上的所有段落文本(以及从段落标签继承属性的文本)都会是 Arial 斜体,因为段落标签从 body 标签中继承了这些属性。但是,您可以使您的规则更具体,并创建一些能覆盖标准继承公式的样式。例如,如果在样式表中创建以下规则:
body {
font-family: Arial;
font-style: italic;
}
p {
font-family: Courier;
font-style: normal;
}
所有正文文本将是 Arial 斜体,但段落(及其继承的)文本除外,它们将显示为 Courier 常规(非斜体)。从技术上来说,段落标签首先继承为 body 标签设置的属性,但是随后将忽略这些属性,因为它具有本身已定义的属性。换句话说,虽然页面元素通常从上级继承属性,但是直接将属性应用于标签时始终会导致覆盖标准继承公式。
结合上述的所有因素,加上其它因素(如 CSS 具体程度,一种为特殊类型的 CSS 规则指定不同权重的体系)以及 CSS 规则的顺序,最终会创建一个复杂的层叠,其中优先级较高的项会覆盖优先级较低的属性。

信息推荐
资讯中心 | 电子商务 | 搜索营销 | 设计学院 | 中医养生 | 养生保健 | 节日祝福 | 民俗文化 | 奇闻趣事
建站知识 | 人世百态 | 网站导航 | 传统节日 | 搜索热点 | 星座运势 | 趣闻轶事 | 祝福的话 | 短信大全
© 2023 QicaiSpace.Com