• CSS样式表层叠顺序的应用规则

    层叠顺序的优先级
    服务器君一共花费 7.919 ms 进行了 3 次数据库查询,努力地为您提供了这个页面。
    广告很萌的
    1. Chapter:

    样式对象具有每个可视化属性一一对应的属性(均为 CSS 属性但更为通用)。如果某个属性未由任何匹配规则所定义,那么部分属性就可由父代元素样式对象继承。其他属性具有默认值。

    如果定义不止一个,就会出现问题,需要通过层叠顺序来解决。

    样式表层叠顺序

    某个样式属性的声明可能会出现在多个样式表中,也可能在同一个样式表中出现多次。这意味着应用规则的顺序极为重要。这称为“层叠”顺序。

    根据 CSS2 规范,层叠的顺序为(优先级从低到高):

    1. 浏览器声明
    2. 用户普通声明
    3. 作者普通声明
    4. 作者重要声明
    5. 用户重要声明

    浏览器声明是重要程度最低的,而用户只有将该声明标记为“重要”才可以替换网页作者的声明。同样顺序的声明会根据特异性进行排序,然后再是其指定顺序。

    举个例子,看下面的截图:

    Chrome 的样式里会有个 user agent stylesheet的东西,这个user agent stylesheet是浏览器的一些默认样式,不同的浏览器把实现这些HTML自带样式的模块称作User Agent Stylesheet。如果对这个默认样式不满意最简单的解决办法就是重新设置该样式的属性,因为user agent stylesheet优先级很低,会被覆盖,这样就不会影响到我们的样式了。

    不同的浏览器实现的User Agent Stylesheet不一,但大部分都能遵循W3C的标准。个人认为chrome实现的User Agent Stylesheet是最符合人们阅读习惯,例如p前后都有1em的外边距等。浏览器的User Agent Stylesheet的优先级是很低的,经常被其他样式覆盖,这也是设置了CSS样式文件后能够起作用的原因。

    HTML 可视化属性会转换成匹配的 CSS 声明。它们被视为低优先级的网页作者规则。

更多 推荐条目

Welcome to NowaMagic Academy!

现代魔法 推荐于 2013-02-27 10:23   

本章最新发布
随机专题
  1. [Python程序设计] Django与表单 4 个条目
  2. [软件工程与项目管理] 开始使用Git 3 个条目
  3. [PHP程序设计] Nginx基本操作释疑 7 个条目
  4. [智力开发与知识管理] 超越整体性学习 5 个条目
  5. [C语言程序设计] C语言里的全局变量 2 个条目
  6. [数据库技术] MySQL常用自带函数 3 个条目
  7. [数据库技术] 数据库范式篇 5 个条目
  8. [软件工程与项目管理] 开始了解Git 5 个条目
  9. [移动开发] 从代码角度去认识HttpClient 2 个条目
  10. [移动开发] Android SQLite增删查改实例(数据:魔弹之王) 2 个条目
  11. [PHP程序设计] 对输入文件类型的检测 1 个条目
  12. [移动开发] Android开发基础知识 4 个条目
窗口