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. ACL实验

    ACL实验 基本配置:略 首先根据题目策略的需求1,从这个角度看,我们需要做一条高级ACL,因为我们不仅要看你是谁,还要看你去干什么事情,用高级ACL来做的话,对于我们华为设备,只写拒绝,因为华为默认 ...

  2. 攻防世界 WEB 高手进阶区 PHP2 Writeup

    攻防世界 WEB 高手进阶区 PHP2 Writeup 题目介绍 题目考点 url 二次解码 index.phps 文件(第一次使用dirsearch可能扫不到,需要加到工具字典里) php 简单语法 ...

  3. vue强制组件重新渲染

    有时候,依赖 Vue 响应方式来更新数据是不够的,相反,我们需要手动重新渲染组件来更新数据.或者,我们可能只想抛开当前的DOM,重新开始.那么,如何让Vue以正确的方式重新呈现组件呢? 强制 Vue ...

  4. Java8新特性之方法引用&Stream流

    Java8新特性 方法引用 前言 什么是函数式接口 只包含一个抽象方法的接口,称为函数式接口. 可以通过 Lambda 表达式来创建该接口的对象.(若 Lambda 表达式抛出一个受检异常(即:非运行 ...

  5. java中的lamda表达式

    List操作: 循环: list.forEach((p) -> System.out.printf("%s %s; %n", p.getFirstName(), p.getL ...

  6. rz安装

    rpm -ivh http://www.rpmfind.net/linux/centos/6.10/os/x86_64/Packages/lrzsz-0.12.20-27.1.el6.x86_64.r ...

  7. 大一C语言学习笔记（2）---快捷键篇

    大家好,博主呢,是一位刚刚步入大一的软件工程专业的大学生,之所以写博客,是想要与同样刚刚接触程序员一行的朋友们一起讨论,进步,在这里记录我的一些学习笔记及心得,希望通过这些点点滴滴的努力,可以让我们离 ...

  8. 12组-Alpha冲刺-3/6

    一.基本情况 队名:字节不跳动 组长博客:https://www.cnblogs.com/147258369k/p/15546442.html 小组人数:10人 二.冲刺概况汇报 侯钦凯 过去两天完成 ...

  9. [cf516E]Drazil and His Happy Friends

    令$d=\gcd(n,m)$,存在$x$和$y$使得$xn+i=ym+j$的充要条件是$i\equiv j(mod \ d)$,因此将$xd+i$(其中$0\le i<d$)作为一组,共有$d$ ...

  10. led汇编点灯

    1. 汇编LED原理 为什么使用Cortex-A汇编 使用汇编初始化soc外设 使用汇编初始化DDR,I.MX不需要,因为它内部的96k ROM中存放了自己编写的启动代码,这些代码可以读取DDR配置信 ...