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 unixtojd() 函数

    ------------恢复内容开始------------ 实例 把 Unix 时间戳转换为儒略日计数: <?phpecho unixtojd();?> 运行实例 » 定义和用法 uni ...

  2. PHP curl_setopt函数

    (PHP 4 >= 4.0.2, PHP 5) curl_setopt — 设置一个cURL传输选项. 说明 bool curl_setopt ( resource $ch , int $opt ...

  3. PHP curl_setopt_array函数

    (PHP 5 >= 5.1.3) curl_setopt_array — 为 cURL 传输会话批量设置选项. 说明 bool curl_setopt_array ( resource $ch ...

  4. PHP stat() 函数

    定义和用法 stat() 函数返回关于文件的信息. 该函数将返回一个包含下列元素的数组: [0] 或 [dev] - 设备编号 [1] 或 [ino] - inode 编号 [2] 或 [mode] ...

  5. 5.21 省选模拟赛 luogu P4207 [NOI2005]月下柠檬树 解析几何 自适应辛普森积分法

    LINK:月下柠檬树 之前感觉这道题很鬼畜 实际上 也就想到辛普森积分后就很好做了. 辛普森积分法的式子不再赘述 网上多的是.值得一提的是 这道题利用辛普森积分法的话就是一个解析几何的问题 而并非计算 ...

  6. 牛客挑战赛 39 牛牛与序列 隔板法 容斥 dp

    LINK:牛牛与序列 (牛客div1的E题怎么这么水... 还没D难. 定义一个序列合法 当且仅当存在一个位置i满足 $a_i>a_,a_j<a_$且对于所有的位置i,$1 \leq a_ ...

  7. 实验08——java百文百鸡

    package cn.tedu.demo; /** * @author 赵瑞鑫 E-mail:1922250303@qq.com * @version 1.0 * @创建时间:2020年7月17日 下 ...

  8. @RestController注解初步理解

    一.在Spring中@RestController的作用等同于@Controller + @ResponseBody. 所以想要理解@RestController注解就要先了解@Controller和 ...

  9. 连通图算法详解之① ：Tarjan 和 Kosaraju 算法

    相关阅读: 双连通分量 ,割点和桥 简介 在阅读下列内容之前,请务必了解 图论相关概念 中的基础部分. 强连通的定义是:有向图 G 强连通是指,G 中任意两个结点连通. 强连通分量(Strongly ...

  10. troubleshoot之:用control+break解决线程死锁问题

    目录 简介 死锁的代码 control+break命令 Full thread dump 死锁检测 Heap信息 总结 简介 如果我们在程序中遇到线程死锁的时候,该怎么去解决呢? 本文将会从一个实际的 ...