CSS选择器分基本选择器(元素选择器，类选择器，通配符选择器，ID选择器，关系选择器)，

属性选择器，伪类选择器，伪元素选择器，以及一些特殊选择器,如has，not等。

在CSS中，权重决定了哪些CSS规则生效，浏览器按如下规则进行CSS权重计算

  • 1000：内联样式

  • 0100：ID选择器

  • 0010：类，伪类，属性选择器

  • 0001：元素，伪元素，通配符，子选择器，相邻选择器等

  • 无：继承样式

​浏览器通过对元素上的CSS规则进行权重计算，权重高的规则将生效，如果权重相同则最后的规则生效，

而使用的important的规则将具备最高权重，如果多条规则有important，同样是最后的规则生效。

css系列，选择器权重计算方式的更多相关文章

  1. 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧

    记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...

  2. CSS 选择器权重计算规则

    其实,CSS有自己的优先级计算公式,而不仅仅是行间>内部>外部样式:ID>class>元素. 一.样式类型 1.行间 <h1 style="font-size: ...

  3. CSS 选择器权重计算规则(转)

    其实,CSS有自己的优先级计算公式,而不仅仅是行间>内部>外部样式:ID>class>元素. 一.样式类型 1.行间 <h1 style="font-size: ...

  4. CSS选择器权重计算

    CSS各种选择器的权重: 1.ID选择器  +100 2.类.属性.伪类选择器   +10 3.元素.伪元素选择器   +1 4.其他选择器   +0 如果有两个CSS样式都作用于某元素,如: #id ...

  5. CSS 导入-选择器-权重

    CSS 导入-选择器 Cascading Style Sheets 层叠样式表 它用来控制网页样式,并允许将样式代码与网页内容分离的一种标记性语言 CSS语法结构 选择器 声明{} 属性名:属性值 c ...

  6. 浏览器+css基础+选择器+权重+匹配规则

    浏览器的组成: shell+内核 shell:用户能看得到的界面就叫shell 内核:渲染rendering引擎和js引擎 现在主流拥有自己开发内核的浏览器:opera现在属于360和昆仑万维 CSS ...

  7. CSS系列------选择器和选择器的优先级

    1.1.基本选择器 通配符选择器(*)      通配符选择器的使用方法如下 *{margin:0px; padding:0px;} //*代表所有的 ID选择器(#) ID选择器的使用方式如下: * ...

  8. CSS选择器权重计算规则

    从CSS代码存放位置看权重优先级:内嵌样式 > 内部样式表 > 外联样式表.其实这个基本可以忽视之,大部分情况下CSS代码都是使用外联样式表. 从样式选择器看权重优先级:important ...

  9. 对CSS了解-选择器权重

    <style type="text/css"> div.ui_infor p {font-size: 16px;} .ui_infor p {font-size: 14 ...

随机推荐

  1. hdu 2860 Regroup（并查集）

    题意: AP x yA recruit with ability rate x were asked to join company y. (0<=x<2^31, 0<=y<n ...

  2. Java第三天【变量、常量、数据类型】

    学习Java第三天!加油!请帖友看看有和不足的地方,和在下说一下,谢谢! 变量 变量(variable): 1.变量的本质就是代表"可操作的存储空间",空间位置是确定的,蛋里面放置 ...

  3. PTA 6-1 求采用邻接矩阵作为存储结构的无向图各顶点的度 (6分)

    PTA 6-1 求采用邻接矩阵作为存储结构的无向图各顶点的度 (6分) 函数接口定义: 函数接口为: void dgree(MGraph G); G为采用邻接矩阵作为存储结构的有向图 裁判测试程序样例 ...

  4. PTA 7-2 邻接表创建无向图 (20分)

    PTA 7-2 邻接表创建无向图 (20分) 采用邻接表创建无向图G ,依次输出各顶点的度. 输入格式: 输入第一行中给出2个整数i(0<i≤10),j(j≥0),分别为图G的顶点数和边数. 输 ...

  5. Java学习（十五）

    下棋又被暴打 所以心态有点爆炸,学完习又去打云顶,忘记写博客了... 所以今天也有点水了,这下棋真是搞崩我心态了. Java学了函数重载 大概的要点在这 还有Web的学习,否定伪类. 如 p:not( ...

  6. java动态编译——tools.jar问题

    笔者在学习中写了一段简单的动态编译代码,但编译一直无法通过,起初认为受路径中存在汉字影响,修改路径后仍然没有解决.最终定位错误是:Java在进行动态编译的时候需要用到tools.jar资源包,若too ...

  7. [cf1495D]BFS Trees

    记$d_{G}(x,y)$表示无向图$G$中从$x$到$y$的最短路,设给定的图为$G=(V,E)$,$T$为其生成树,$E_{T}$为$T$的边集 下面,考虑计算$f(x,y)$-- 首先,对于一棵 ...

  8. Python之99乘法表代码

    #coding=utf-8 #左下三角格式输出九九乘法表 for i in range(1,10):      for j in range(1,i+1):          print " ...

  9. 《重学Java高并发》Sempahore的使用场景与常见误区

    大家好,我是威哥,<RocketMQ技术内幕>一书作者,荣获RocketMQ官方社区优秀布道师.CSDN2020博客执之星Top2等荣誉称号.目前担任中通快递技术平台部资深架构师,主要负责 ...

  10. System类的常用方法（currentTimeMillis与arraycopy）

    System类的常用方法 currentTimeMillis与arraycopy import java.util.Arrays; /* java.lang.System类中提供了大量的静态方法,可以 ...