未来往事

CSS样式优先级 不指定

Rinald 本站原创 WEB前端 2014/01/14 23:33
一、CSS样式选择器优先级
ID选择器(形如#divMain{})  >  类(形如.divSpecial{})  >  标签(形如body{})

二、CSS文件的优先级
1、标有”!important”的规则有最高优先级
一个样式规则可以有一个”important”附带标签,表示该样式规则具有最高优先级。例如下面例子中,前景色被标为important。
注意:这种声明容易引起混乱,因此通常使用得较少。

2、创作者规则优先级高于浏览者规则
浏览器允许浏览者创建样式规则以覆盖系统缺省值。在此情况下,由网页创作者明确设定得样式优先级较高,而浏览者设置得样式规则优先级较低。

3、更特殊得规则优先于不够特殊的规则
在决定特殊性时,selector中的ID属性有最高优先级。基于ID selector的优先级可通过计数Selector中类属性的数量确定,数量越多优先级越高。假如规则仍然无法确定优先级,则HTML元素名的数量决定了特殊性。

4、在同一个级别的情况下,最后指定的规则有优先权
假如两个或更多的规定在应用了前三个规定具有相同优先级,则后给出的规则优先于早先给出的规则。
如果在网页的HEAD标记中同时使用了STYLE标记符(指定嵌入式样式)和LINK标记符(指定链接式样式),并且这两个样式指定中同时应用了具有同一优先级别的样式,则STYLE标记符和LINK标记符的先后顺序将决定样式的优先级。

例如,如果在LINK所链接的样式表(mycss.css)中定义了以下一条样式规则:

同时在嵌入式样式定义中也定义了一条规则:

在网页中的样式定义如下所示:
由于style标记符中定义的样式后出现,因此它具有更高的优先级,所以网页中H1标记符的内容将显示为黄色(yellow)。同样,如果将link标记符的位置移动到标记符之后,则网页中H1标记符的内容将显示为红色(red)。

另外,由于直插式样式(使用html标记的style属性设置的样式)的位置最接近于样式作用的标记符,因此它通常具有高优先级。
作者:Rinald @『未来往事 | 记录生活,存储回忆!
原文地址:http://fity.cn/post/429/
本站采用「署名 4.0 国际(CC BY 4.0)」创作共享协议。通俗地讲,只要在使用时署名,那么使用者可以对本站所有原创内容进行转载、节选、混编、二次创作,允许商业性使用。除非在文章正文内单独说明,本站欢迎各种形式的转载。互联网技术更新很快,本站很多文章都具有实效性,我会及时更新原文,但转载的文章无法通知更新。为了不给读者造成困惑或误导,请大家在转载时保留此出处信息。
发表评论
  昵称 [注册]
  密码 (游客无需密码)
  网址
  电邮(电子邮件地址不会被公开, 仅用于接收评论回复提醒使用)
OpenID登入 权限选项 表情