CSS的权重如下:

!important  Infinity正无穷
 行间样式  1000
 id     100
 class|属性|唯类 10
 标签|伪元素  1
 通配符   0
 256进制

当出现多个选择器时 在同一行的选择器权重相加即可

当两个混合选择器权重相同时优先选择后面的选择器

如:

html

<div class="divClass"  id="idDiv">

<p class="classP" id="idP">1</p>

</div>

css:

#idDiv p.classP{

background-color:red;

}

div .classP#idP{

background-color:green;

}

两者权重相同 但是遵从先来后到 所以显示为绿色

<--本人小白 开通博客只是为了学习交流发的东西比较低级 不喜勿喷 谢谢!!-->

CSS权重的比较方法的更多相关文章

  1. css权重计算方法浅谈

    在这之前只知道css权重的皮毛,比如说:行内权重比头部权重高,头部比外部样式权重高----工作中才知道真正理解css权重重要性.理解权重了才能写出来最优css选择器来.对后面学习less,scss有很 ...

  2. 移动端前端笔记 — 遇到的常见JS与CSS问题及解决方法 ( 摘自zdwzdwzdw)

    笔者接触移动前端快一年了,特将平时的一些笔记整理出来,希望能够给需要的人一些小小的帮助.同时也由于笔者的水平有限,虽说都是笔者遇到过使用过的,但文中可能也会出现一些问题或不严谨的地方,望各位指出,不胜 ...

  3. css权重是什么

    css权重是什么? 概述 css Specificity中文一般译为css优先级.css权重.相比"权重","优先级"更好理解,mozilla官方中文文档就翻译 ...

  4. CSS:权重和层叠规则决定了其优先级

    首先,给大家看一篇关于CSS优先级的示例:http://www.ido321.com/76.html 一.基本的优先级规则 比较同一级别的个数,数量多的优先级高,如果相同即比较下一级别的个数,至于各级 ...

  5. css权重及优先级问题

    css权重及优先级问题 几个值的对比 初始值 指定值 计算值 应用值 CSS属性的 指定值 (specified value)会通过下面3种途径取得: 在当前文档的样式表中给这个属性赋的值,会被优先使 ...

  6. 为IE单独写CSS的三种方法

    本文由 Kayo Lee 发表,本文链接:http://kayosite.com/the-methods-make-css-only-for-ie.html 因为万恶的 IE 存在各种的不标准,因此, ...

  7. 三种纯CSS实现三角形的方法

    看到像上图这样的 tip 的小三角,你会怎么办? 切个图上去?恩,不错,简单,兼容性也一级棒,不但好控制,那点小东西也增加不了多少图片的大小.但有没有更好更讲究技巧的办法呢?哈哈,那必须有啊,而且还不 ...

  8. CSS清除浮动的方法

    CSS清除浮动的方法有哪些呢?经常性地会使用到float,很多邪门的事儿都有可能是浮动在作怪,清除浮动是必须要做的,而且随时性地对父级元素清除浮动的做法也被认为是书写CSS的良好习惯之一.下面看今天的 ...

  9. CSS中垂直居中的方法

    昨天总结了css中水平居中的方法,今天来总结一下css中实现垂直居中的方法. line-height line-height用于实现单行文本的垂直居中,如下图中,我们要求单行文本垂直居中,只需要将di ...

随机推荐

  1. flask跨域

    from flask import Flask from flask_cors import CORS, cross_origin app = Flask(__name__) CORS(app) @a ...

  2. Maven pom.xml 常用打包配置

    <build> <!-- 指定JAVA源文件目录 --> <sourceDirectory>src</sourceDirectory> <!-- ...

  3. 理解mouseover,mouseout,mouseenter,mouseleave

    mouseover定义和用法 当鼠标指针位于元素上方时,会发生 mouseover 事件. 该事件大多数时候会与 mouseout 事件一起使用. mouseover() 方法触发 mouseover ...

  4. Luogu3403: 跳楼机

    题面 传送门 Sol 有一个显然的想法 处理出\(y, z\)能凑出的高度 然后这些高度凑一些\(x\)就可以得到其它的高度 那么可以把这些\(y, z\)凑出的高度对\(x\)取模,其它的用\(x\ ...

  5. C语言——栈的基本运算在顺序栈上的实现

    头文件 Seqstack.h #define maxsize 6 //const int maxsize = 6; // 顺序栈 typedef struct seqstack { int data[ ...

  6. JavaWeb中Servlet和JSP的分工案例

    jsp和Servlet的分工:   * JSP:     > 作为请求发起页面,例如显示表单.超链接.     > 作为请求结束页面,例如显示数据.   * Servlet:     &g ...

  7. IE的兼容性设置 X-UA-Compatible

    < meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" /> 是IE8 ...

  8. 又续CSS3

    这次主要讲呢 1.box-sizing属性 语法:box-sizing: content-box|border-box|inherit; box-sizing属性的用法 box-sizing属性可以为 ...

  9. 推卡:“积分侠”的福利 广发DIY信用卡

    广发diy信用卡最大的优势在持卡人在三大类商户刷卡消费可享受3倍积分优惠,很多卡友不知道这些商户到底有哪些,以及商户mcc码是什么,下面和小编一起来看看. 可享受3倍积分的商户类型 持卡人可在以下三大 ...

  10. JDK/bin下工具列表说明

    JDK/bin下工具列表说明 appletviewer.exe:一种执行HTML文件上的Java小程序类的Java浏览器 apt.exe:注解处理工具(Annotation Processing To ...