CSS的优先级规则有两类

1.位置群组规则

最高优先级为元素内嵌的style样式，如<div style=” “></div>

次高优先级为html头部中的<style>标签里面的样式

第三高优先级为通过头部<style>里面@import导入的样式表

第四优先级为通过<link>标签外链的样式表

第五优先级为<link>标签外链的样式表中通过@import导入的样式表

最低优先级为浏览器默认样式；

2.选择符群组规则

在同一位置群组中CSS的优先级将遵循选择符群组规则：

内嵌的style > id选择器 > 类选择器 > 标签选择器 > 通配符选择器*

可以假设：

style的权重为1000

id选择器权重为100

类选择器（类和伪类）的权重为10

标签选择器（元素和伪元素）的权重为1

通配符*为0

有三点需要注意：

1.位置群组将优先作用，在相同的位置输入多个样式或绑定多个样式表的时候，他们的绑定顺利决定了他们的优先级，后绑定的样式表会覆盖前面的样式表

2.!important拥有超越位置群组的最高优先级，不过如果不同的位置群组两个样式群组分别定义了!important，则位置群组将发挥作用；

<head><style type=”text/css”>.right{ color00F!important;}</style></head>

<body><div style=”colorF00!important;”>         例子例子例子        </div></body>

文字将显示为红色（#F00）

3.在IE6中，a:hover伪类的权重大于类,所以不要使用会产生兼容性的写法

CSS的优先级规则的更多相关文章

  1. 【学习笔记】CSS优先级规则

    CSS的优先级规则很多地方的说法都是错误的,常见错误说法是inline css>内部样式>外部样式,其实并没有这种规定.真正的CSS优先级确定是通过特性值大小确定的,在特性值大小相同的情况 ...

  2. 强制改变css样式优先级

    .list{ left:20px!important; } css !important作用是提高指定CSS样式规则的应用优先权. !important是CSS1就定义的语法,作用是提高指定样式规则的 ...

  3. 权重和层叠规则决定了CSS样式优先级

    一.基本的优先级规则 比较同一级别的个数,数量多的优先级高,如果相同即比较下一级别的个数,至于各级别的优先级如下: important > 内联 > ID > 类 > 标签 | ...

  4. CSS选择器优先级总结

    CSS三大特性-- 继承. 优先级和层叠. 继承:即子类元素继承父类的样式; 优先级:是指不同类别样式的权重比较; 层叠:是说当数量相同时,通过层叠(后者覆盖前者)的样式. css选择符分类 首先来看 ...

  5. CSS 样式优先级

    首先,选择器优先级顺序 优先级逐级增加的选择器列表: 通用选择器(*) 元素(类型)选择器 类选择器 属性选择器 伪类 ID 选择器 内联样式 !important 规则例外,该样式声明会覆盖CSS中 ...

  6. 有利于SEO优化的DIV+CSS的命名规则小结

    可以先去这里温习一下CSS和HTML的知识!DIV+CSS规范命名大全集合  CSS开发技巧整理 一.CSS文件及样式命名 1.CSS文件命名规范 全局样式:global.css/master.css ...

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

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

  8. 转载css层级优先级。

    解读CSS样式优先级(修改门户自定义样式必读) 一.什么是CSS优先级?所谓CSS优先级,即是指CSS样式在浏览器中被解析的先后顺序.当同一个元素(或内容)被多个CSS选择符选中时,就要按照优先权取舍 ...

  9. css的优先级以及!important的使用

    CSS的优先级应该是作为CSS基本知识而广为知道的,所以CSS入门后,就一直把CSS的优先级记挂在心里(自觉告诉自己这地方很可能会摔跤).起初可能是因为自己的项目经验不够丰富,或者是自己所接触到的项目 ...

随机推荐

  1. ThreadLocal,ThreadLocalMap,Thread 的相互关系

    1.ThreadLocal. 真正关键的类是它的内部类ThreadLocalMap,ThreadLocal 基本上相当于一个代理,或者算是Facade模式的应用,还没想清楚这种设计的妙处.(经过分析, ...

  2. UE中使用正则表达式的一些技巧

    UE中使用正则表达式的一些技巧 2010-12-24 10:33:19 分类: Linux 以下是网上摘录的UE 技巧 1)删除空行: 替换 %[ ^t]++^p 为 空串  2)删除行尾空格: 替换 ...

  3. 传统三层结构和MVC之于贫血模式和充血模式以及领域建模

      相信很多人跟我一样,一开始在使用贫血模式的三层结构:抽象出来一个贫血的实体封装,然后把对模型的所有操作,分离出来,分离到BLL层去,然后DALL层负责把这些操作和数据库产生映射,负责读写删改的操作 ...

  4. Oracle下的IF EXISTS()

    妈蛋..作为一个使用了SQL SERVER有4 5年的程序猿,开始用Oracle真他妈不习惯.写法真他妈不一样.比如像写个像IF EXISTS(SELECT * FROM sys.tables WHE ...

  5. node-odata: 基于 NodeJS 的 REST 框架

    该开源项目目前已被 OData 官网 (odata.org)收录 关于 node-odata node-odata 可以让你轻松创建 REST API, 并能使用 OData 协议的格式进行数据的查询 ...

  6. jenkins的搭建和使用

    Jenkins 是一个开源项目,提供了一种易于使用的持续集成系统,使开发者从繁杂的集成中解脱出来,专注于更为重要的业务逻辑实现上.同时 Jenkins 能实施监控集成中存在的错误,提供详细的日志文件和 ...

  7. [原]HDU-1598-find the most comfortable road(暴力枚举+Kruskal最小生成树)

    题意: 给出一个图,然后Q个询问,每次询问从一个节点到另一个节点,联通图中的“最大边和最小边之差”的最小值,但如果节点之间不连通,则输出-1. 思路:由于询问Q < 11,m < 1000 ...

  8. centos chrome

    在centos6.X和redhat enterprise 中安装chrome,我找了很久都不行,今天终于找到了可以用下脚本那安装: #! /bin/bash # Google Chrome Insta ...

  9. JAVA中的内部类使用总结

    1)         内部类的优点是:内部类可以访问外部类的私有成员变量,而不需要new外部类的对象. 2)         内部类又分为:静态内部类.匿名内部类.局部内部类.成员内部类. 3)    ...

  10. AOJ 0525 - Osenbei

    http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=50785 翻译:http://blog.csdn.net/acm_10000h ...