CSS 选择器及优先级

1.根据权值计算

div .class1 #people的权值等于1+10+100=111

　　.class2 li #age的权值等于10+1+100=111

2.权值相同，那么以后定义的为准。

3.一般在类选择器、属性选择器、伪类选择器优先级比较容易出错。

css3选择器主要有：基本选择器 ， 层次选择器，  伪类选择器 ，  伪元素选择器 ， 属性选择器

基本选择器

 层次选择器

伪类选择器分为 动态伪类选择器， 目标伪类选择器， 语言伪类选择器， UI元素状态伪类选择器，结构伪类选择器，否定伪类选择器

伪元素选择器

属性选择器

CSS 选择器及优先级的更多相关文章

  1. CSS选择器以及优先级与匹配原理

    最常用的五类CSS选择器 准确而简洁的运用CSS选择器会达到非常好的效果.我们不必通篇给每一个元素定义类(class)或ID,通过合适的组织,可以用最简单的方法实现同样的效果.在实际工作中,最常用的选 ...

  2. CSS选择器、优先级与匹配原理（转）

    CSS选择器.优先级与匹配原理 导航 为了分析Bootstrap源码,所以的先把CSS选择器相关的东东给巩固好 废话就不多说了 CSS 2.1 selectors, Part 1 计算指定选择器的优先 ...

  3. 详解CSS选择器、优先级与匹配原理

    原文链接:http://polaris1119.javaeye.com/blog/764428 作为一个Web开发者,掌握必要的前台技术也是很重要的,特别是在遇到一些实际问题的时候.这里给大家列举一个 ...

  4. 转载：详解CSS选择器、优先级与匹配原

    转载网址:http://polaris1119.javaeye.com/blog/764428 文章就CSS选择器的优先级问题做了一些总结,严格来讲,选择器的种类可以分为三种:标签名选择器.类选择器和 ...

  5. CSS选择器、优先级和匹配原理

    作为一个Web开发者,掌握必要的前台技术也是很重要的,特别是在遇到一些实际问题的时候.这里给大家列举一个例子: 给一个p标签增加一个类(class),可是执行后该class中的有些属性并没有起作用.通 ...

  6. 详解CSS选择器、优先级与匹配原理【转】

    作为一个Web开发者,掌握必要的前台技术也是很重要的,特别是在遇到一些实际问题的时候.这里给大家列举一个例子: 给一个p标签增加一个类(class),可是执行后该class中的有些属性并没有起作用.通 ...

  7. （转）css选择器及其优先级

    文章主要介绍什么是CSS选择器,CSS选择器的分类以及CSS选择器的优先级三部分内容,希望能够帮助到正在学习CSS的童鞋,有什么不足的地方欢迎大家批评指正. 一.什么是CSS选择器? CSS选择器又被 ...

  8. CSS选择器、优先级与匹配原理

    为了分析Bootstrap源码,所以的先把CSS选择器相关的东东给巩固好 废话就不多说了 CSS 2.1 selectors, Part 1 计算指定选择器的优先级:重新认识CSS的权重 标签的权值为 ...

  9. CSS选择器及其优先级

    一:一些普通的选择器 <!DOCTYPE html> <html> <head lang="en"> <meta charset=&quo ...

随机推荐

  1. PHP uksort() 函数

    ------------恢复内容开始------------ 实例 使用用户自定义的比较函数对数组 $arr 中的元素按键名进行排序: <?phpfunction my_sort($a,$b){ ...

  2. PHP quoted_printable_decode() 函数

    实例 对经过 quoted-printable 编码后的字符串进行解码,返回 8 位的 ASCII 字符串: <?php高佣联盟 www.cgewang.com$str = "Hell ...

  3. luogu P4008 [NOI2003]文本编辑器 splay 块状链表

    LINK:文本编辑器 这个东西感觉块状链表写细节挺多 (块状链表本来就难写 解释一下块状链表的做法:其实是一个个数组块 然后利用链表给链接起来 每个块的大小为sqrt(n). 这样插入删除的时候直接暴 ...

  4. Javascript 创建对象的三种方式

    function createPerson(name, qq) //工厂方式 { //在工厂里创建个对象 var obj=new Object(); obj.name=name; obj.qq=qq; ...

  5. 数据分析学习 third week （7.29~8.4）

    概率分布简介 简单地介绍下常用概率分布的理论知识. 基础概念 1.概率 概率直观上是指一个事件发生可能性大小的数量指标 概率的统计定义:在不变的条件下,重复进行$n$次试验,事件$A$发生的频率稳定在 ...

  6. JS中的数组复制问题

    JS中的数组复制问题 前言 首先提到复制,也就是拷贝问题,就必须要明确浅拷贝和深拷贝. 浅拷贝:B由A复制而来,改变B的内容,A也改变 深拷贝:B由A复制而来,改变B的内容,A的内容不会改变 总的来说 ...

  7. JS笔记 运算符 函数

    1.运算符 1.位运算符 将数字转换为二进制后进行运算 只做整数运算,如果是小数的话,则去掉小数位再运算 2.位运算 1.按位 与:& 语法:a&b; 2.按位 或| 语法:a|b 任 ...

  8. Catalina 默认使用zsh了，你可习惯

    zsh 成为默认 shell 淘汰掉我的旧MBP换新后,欢天喜地打开Terminal,感觉有点不对,提示符什么时候变成了 %. 查询了一些资料发现,原来在2019年WWDC期间,苹果推出了macOS ...

  9. C#LeetCode刷题-二叉搜索树

    二叉搜索树篇 # 题名 刷题 通过率 难度 220 存在重复元素 III   19.3% 中等 315 计算右侧小于当前元素的个数   31.9% 困难 327 区间和的个数   29.5% 困难 3 ...

  10. Linux内核之 内核同步

    上文我们介绍过进程调度,Linux内核从2.6版本开始支持内核抢占,所以内核很多代码也需要同步保护. 一.同步介绍 1.临界区与竞争条件 所谓临界区(critical regions)就是访问和操作共 ...