权重计算规则

  • 内联样式，如: style=" "，权值为1000。
  • ID选择器，如：#content，权值为0100。
  • 类，伪类和属性选择器，如.content，权值为0010。
  • 类型选择器和伪元素选择器，如div p，权值为0001。
  • 通配符、子选择器、相邻选择器等的。如*、>、+,权值为0000。

  • 继承的样式没有权值。

    权值越大，权重越高

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

  6. css系列，选择器权重计算方式

    CSS选择器分基本选择器(元素选择器,类选择器,通配符选择器,ID选择器,关系选择器), 属性选择器,伪类选择器,伪元素选择器,以及一些特殊选择器,如has,not等. 在CSS中,权重决定了哪些CS ...

  7. css选择器权重、样式继承、默认样式

    学过css的小伙伴都是指css选择器的权重 !important Infinity 行间样式 1000 id   100 class|属性|伪类 10 标签|伪元素 1 通配符 0 权重相同 相同cs ...

  8. CSS选择器优先级计算

    优先级从高到低排列,浏览器优先满足前面的规则 1,!important优先级最高 2,内联样式 3,作者>读者>浏览器 4,优先级权重加法 id选择器+100/个 类/伪类选择器+10/个 ...

  9. css选择器权重问题

    important infinity 行间样式 1000(256进制) id 100 class/属性/伪类 10 标签/伪元素 1 通配符 0

  10. 常见CSS选择器的权重和优先级

    一.常见CSS选择器 [元素选择器] 1.通配选择器:*(匹配所有元素) a.效率不高,页面上的标签越多,效率越低,所以页面上最好不要出现这个选择器 2.标签选择器:li(匹配标签为li的元素) a. ...

随机推荐

  1. Linux超级守护进程——xinetd

    一 Linux守护进程 Linux 服务器在启动时需要启动很多系统服务,它们向本地和网络用户提供了Linux的系统功能接口,直接面向应用程序和用户.提供这些服务的程序是由运行在后台的守护进程来执行的. ...

  2. python之线程同步

    lock与rlock 使用lock不能连续两次获取锁,获取锁必须先释放锁.但是在一个线程中调用另一个函数时,在该函数中要继续操作共享的数据,这时获取锁就相当于连续执行两次获取锁,所以lock就不适用该 ...

  3. BeatifulSoup模块

    一.介绍 Beautiful Soup 是一个可以从HTML或XML文件中提取数据的Python库.它能够通过你喜欢的转换器实现惯用的文档导航,查找,修改文档的方式.Beautiful Soup会帮你 ...

  4. C#概念总结（二）

    1.C#的方法:<access Specifier>  <Return Type>< Method Name>(Parmeter list){     method ...

  5. AI-解析器-request.data内部如何按照自定义解析格式-解析数据

    QUESTION:post方法中调用request.data方法时,当在Courseview类中添加parser_classes=[ForParser,],就可以将数据解析成parser_classe ...

  6. C++ Primer 笔记——异常处理

    1.栈展开过程沿着嵌套函数的调用链不断查找,直到找到了与异常匹配的catch句子为止,或者也可能一直没找到匹配的catch,则程序将调用terminate,退出主函数后查找过程终止.假设找到了一个ca ...

  7. inline namespace

    无意中看到C++11中的新特性inline namespace, 先附上官方的解释 Inline namespace The inline namespace mechanism is intende ...

  8. WBXML 1.3协议摘要

    协议地址:WAP195   网络字节顺序:big-endian.   为什么要加0x40? 参考:Compressing XML When an element contains content (t ...

  9. C#动态系统托盘图标

    C#动态系统托盘图标 利用timer组件定时执行变化. using System; using System.Windows.Forms; namespace DynamicStockIcon { p ...

  10. JavaScript中this 详解

    涵义 this 关键字是一个非常重要的语法点.毫不夸张地说,不理解它的含义,大部分开发任务都无法完成. 首先, this 总是返回一个对象,简单说,就是返回属性或方法“当前”所在的对象. this.p ...