css的优先级从低到高依次是：内部样式表的优先级为（1，0，0，0），id选择器优先级为（0，1，0，0），class选择器为（0。0，1，0），tag标签为（0。0，0，1）。除此之外，!important权重最高，比inline style还要高。

从字面意思就知道它最重要。

在这里插个题外话。

我之前一直错误的以为!important仅仅是css hack的一个写法。

我印象中!important是号称支持到ie7及以上的，不支持ie6的。不知道人没有也这么觉得。。。直到今天我才意识到我的错误。事实上在我知道了!important能够改变css优先级的的时候还知道了ie6也是认识!important的。仅仅只是IE6读取含有!important'的css属性是顺序读取的。这是IE6的一个非常典型的bug。比方：

  1. <style type="text/css">
  2.       div{
  3.             background: red !important;
  4.             background: blue;
  5.       }
  6. </style> ­

这个结果是div的背景为blue；假设这样：

  1. <style type="text/css">
  2.         div{
  3.              background: blue;
  4.              background: red !important;
  5.         }
  6. </style> ­

把两个属性倒换位置。结果背景为red。这说明IE6并不会对!important开放特权。

而是一视同仁。

比如：

情形一：div.test1 .span a 优先级 （0，0，2，2）。
情形二：span#xxx .songs li 优先级（0，1，1，2）；

情形三：#xxx li 优先级 100 +1 （0，1，0。1）；

直接上代码：

  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. 	<meta charset="UTF-8">
  5. 	<title>Document</title>
  6. 	<style>
  7. 		div .aa{color:orange;}/*（0，0，1。1）*/
  8. 		.bn .aa{color:red;}/*（0。0。2，0）*/
  9. 		#bb .aa{color:yellow;}/*（0。1，1，0）*/
  10. 		#bb a{color:blue;}/*（0，1，0，1）*/
  11. 	</style>
  12. </head>
  13. <body>
  14. 	<div id="bb" class="bn">
  15. 		<a style="color:gray;" href="#" class="aa">link</a>
  16. 	<div>
  17. </body>
  18. </html>

代码运行后，link字体的颜色为gray，由于内部样式表的优先级最高。为（1，0，0。0）。

可是假设。给div .aa{color:orange!important;}这样一个属性，那么link字体的颜色就是orange了。

关于css优先级的更多相关文章

  1. css选择器及css优先级

    三个css选择器:id选择器#test1{ }.class选择器.test2{ }.标签选择器div{ }对三个div:<div>我是普通div</div>.<div i ...

  2. 关于CSS的优先级,CSS优先级计算

    原则一: 继承不如指定原则二: #id > .class > 标签选择符原则三:越具体越强大原则四:标签#id >#id ; 标签.class > .class CSS优先级权 ...

  3. css 优先级 机制

    多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况. 一般情况下,优先级如下: (外部样式)External style sheet ...

  4. z-index、display、selector选择器优先级css优先级面试用到

    z-index:控制元素叠放顺序,哪个z-index数值越大,那个优先被叠放在上面. relative.absolute.fixed这三种情况可以使用z-index. static不可以使用. dis ...

  5. css优先级和层叠

    css优先级和层叠 1.优先级    计算方法:        a.行内样式        b.id选择器的数量        c.类,伪类和属性选择器的数量        d.标签选择器和伪元素选择 ...

  6. 使用background和background-image对CSS优先级造成影响

    在写一个关于背景图的CSS时候发现一个奇怪的现象, 原图: 如下代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona ...

  7. CSS优先级算法是如何计算？

    CSS的specificity特性或非凡性,它是一个衡量css优先级的一个标准, 既然的标准就有判定规定和计算方式,specificity用一个四位数来表示, 更像四级从左到右,左的最大级,一级大于一 ...

  8. CSS优先级总结(转载)

    样式的优先级 多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况. 一般情况下,优先级如下: (外部样式)External styl ...

  9. css优先级计算

    主要的css选择器有id,class,tag,[],:,::等,而通常需要对其优先级进行判断的有id,class,tag,另外内联样式和!important也和css的优先级有关系. 如果将这五种不同 ...

  10. css 优先级

    css优先级的四大原则: 原则一: 继承不如指定 如果某样式是继承来的永远不如具体指定的优先级高.例子1:CODE:<style type="text/css"> &l ...

随机推荐

  1. C# 非模式窗体show()和模式窗体showdialog()的区别

    对话框不是模式就是无模式的.模式对话框,在可以继续操作应用程序的其他部分之前,必须被关闭(隐藏或卸载).例如,如果一个对话框,在可以切换到其它窗 体或对话框之前要求先单击"确定"或 ...

  2. 用于兼容浏览器的js写法

    用于引用的源文件代码: var Common = { getEvent: function() {//ie/ff if (document.all) { return window.event; } ...

  3. Python Django 中的STATIC_URL 设置和使用解析

    使用Django静态设置时,遇到很多问题,经过艰苦的Baidu, stack overflow, Django原档阅读,终于把静态图片给搞出来了.特记录下来. 关键的概念:Django中,静态资源的存 ...

  4. 阿里云无法远程连接数据库MySQL错误码10060解决办法

    使用图形界面管理工具Navicat for MySQL连接Mysql数据库时提示错误:Can't connect to MySQL server (10060) 导致些问题可能有以下几个原因: 1.网 ...

  5. linux下使用cronjob定时执行php脚本

    在linux中输入命令 crontab -e 然后使用vim的命令编辑打开的文件,输入 * * * * /usr/bin/php -f /home/userxxx/update.php 保存,退出,好 ...

  6. UOJ #17. 【NOIP2014】飞扬的小鸟 背包DP

    #17. [NOIP2014]飞扬的小鸟 Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 4902  Solved: 1879 题目连接 http:// ...

  7. flash 跨域加载 二次加载

    var url2:String = "http://thirdapp0.qlogo.cn/qzopenapp/fa5d80ebf9fc89aaa1d7ddb0e1b861e58d77b409 ...

  8. xvcd – The Xilinx Virtual Cable Daemon

    http://debugmo.de/2012/02/xvcd-the-xilinx-virtual-cable-daemon/ I recently discovered an almost undo ...

  9. 配置tomcat让shtml嵌套文件显示

    之前,我知道tomcat可以直接解析shtml文件,在浏览器中显示效果来,后来由于需求发生改变,比如说 在做静态化生成的时候一个网站的头部和底部都是一样的,如果每个页面都生成一次,显然很浪费时间,所有 ...

  10. oracle之表空间(tablespace)、方案(schema)、段(segment)、区(extent)、块(block)

    数据文件和日志文件是数据库中最关键的文件.它们是数据存储的地方.每一个数据库至少有一个与之相关的数据文件,通常情况下不仅仅一个,有非常多.数据在数据文件里是怎样组织的?要了解这些内容我们首先必须理解什 ...