主要的css选择器有id,class,tag,[],:,::等，而通常需要对其优先级进行判断的有id,class,tag,另外内联样式和!important也和css的优先级有关系。

如果将这五种不同情况的优先级以数字的形式来表示的话，其对应关系如下：

!important(10000) > 内联样式(1000) > id(100) > class(10) > tag(1)

则通常的css优先级比较可转化为数值大小的比较，如：#list li和.list .content ul li，其优先级为：

100+1=101 > 10+10+1+1=22

前者的优先级大于后者。

css优先级计算的更多相关文章

  1. css优先级计算规则

    原文:css优先级计算规则 最近面试了一些求职者,我问css优先级计算规则是怎样的?答曰ID优先级>class>元素选择器,外联样式优先级低于内联样式,内联样式优先级低于行间样式,然后就没 ...

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

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

  3. 关于CSS的优先级,CSS优先级计算,多个class引用

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

  4. css优先级计算规则——权重

    一.css的优先级 当对同一个元素设置相同的多个声明时,会按照优先级的高低选择应用哪种声明. <style> #id{ color:red; } p{ color:blue; } < ...

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

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

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

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

  7. css优先级判断

    概念 浏览器是通过判断优先级,来决定到底哪些属性值是与元素最相关的,从而应用到该元素上.优先级是由选择器组成的匹配规则决定的. 如何计算? 优先级是根据由每种选择器类型构成的级联字串计算而成的. 它不 ...

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

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

  9. css优先级汇总

    原文:css优先级汇总 我所理解的css优先级:当两个或者多个样式作用于同一个元素时,就会出现css优先级的问题. 多重样式优先级:当内联样式.内部样式和外部样式作用于同一个元素时,属于多重样式的范畴 ...

随机推荐

  1. SQL服务器名称更改

    引用地址:http://blog.sina.com.cn/s/blog_6c9f8a0501016s3p.html 1.使用select @@ServerName可以看到当前数据库的服务器名 2.从S ...

  2. ECSTORE 关于FILTER条件所代表的含义

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 //以下为ecstore filter条件所代表的含义 $FilterArray= array(         ' ...

  3. Install FFmpeg, Mplayer, Mencoder, MP4Box, Flvtool2

    You can use the following tutorial to install ffmpeg and other video modules in your centos server.F ...

  4. AngularJs 如何监视外部变量是否改变？ 如何使用$cookieStore保存cookie？

    1. 如何监视外部变量是否改变? 如果我们要求:在$scope之外改变一个外部变量时,触发一些操作.我们可以将外部变量写进$watch中,如图中所示.返回的n表示newValue,即新的值.o表示ol ...

  5. 【原创】CLEVO P157SM外接鼠标键盘失灵解决：更换硅脂（附带最新跑分数据）

    作者批注:本文允许转载,并且希望给搜索未来人类.蓝天.CLEVO.更换硅脂或者任何有关关键字的朋友提供帮助. 原文地址:http://www.cnblogs.com/c4isr/p/3514140.h ...

  6. Android 将从网络获取的数据缓存到私有文件

    1:activity_main.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/androi ...

  7. java构造方法的不同

    分为有参数和无参数,还有THIS的使用方法,可用于传递给类,也可用于调用其它构造方法. public class Book { private String name; public Book(){ ...

  8. 淺析LED、LED背光、OLED的技術原理與區別

    眼下很多廠商在推廣自己產品的時候都偷換了概念.明明是LED背光顯示器卻要簡稱為LED顯示器.事實上LED顯示器和目前的LED背光顯示器有著本質的區別.當然容易讓大家混淆的還有個技術非常先進的OLED. ...

  9. C 語言中的編譯指示 (Pragma)

    編譯指示 #pragma 是用來告知編譯器某些特殊指示,例如不要輸出錯誤訊息,抑制警告訊息,或者加上記憶體漏洞檢查機制等.這些指示通常不是標準的 C 語言所具備的,而是各家編譯器廠商或開發者所制定的, ...

  10. pydev package包中__init__.py作用

    Eclipse用pydev,新建一个pydev package时,总会自动地生成一个空的__init__.py文件. 原来在python模块的每一个包中,都有一个__init__.py文件(这个文件定 ...