今天练习css的时候，重叠后的style发现不起作用，原来css选择器优先级大有文章。

声明: yi下内容选自 51cto.com  --加以自己的理解 以备日后参照使用，毕竟自己理解的才是自己的。

三种基本的选择器
◆标签名选择器，如：p{}，h3{}   直接使用HTML标签作为选择器。
◆类选择器，如.className{}。
◆ID选择器，如#tab1{}。

扩展选择器
◆后代选择器，如.polaris span img{}     空格间隔，最终指向img的样式设定
◆群组选择器，如div,span,img{}            共同设定三个标签的样式，这样写省代码

选择器的优先级别
通常用1表示      标签名  选择器的优先级
      用10表示    类        选择器的优先级
      用100标示  ID        选择器的优先级
      用1000标示   标签内引入的style

关于Css选择器优先级的更多相关文章

  1. 深入理解CSS选择器优先级

    题外话 今天把 <CSS REFACTORING>(中文名叫<CSS重构:样式表性能调优>)电子书粗略的浏览了一遍,这本书很薄,150页左右,首先是介绍了什么是重构并举了两个简 ...

  2. CSS选择器优先级（转）

    原文:http://www.cnblogs.com/wangfupeng1988/p/4285251.html 另外,w3c有文章介绍了CSS选择器的特定性,见https://www.w3.org/T ...

  3. day44:CSS选择器优先级&JS基础

      目录 1.CSS选择器优先级 2.补充:margin是可以设置百分比的 3.JS 3.1 js代码的引入方式 3.2 变量 3.3 数据类型 3.4 数组(类似于python中的列表) 3.5 自 ...

  4. 看完就懂--CSS选择器优先级的计算

    CSS选择器优先级的计算 什么是选择器的优先级 优先级的计算与比较(一) - 优先级具有可加性 - 选择器优先级不会超过自身最大数量级 - 同等优先级情况下,后写的覆盖前写的 - 并集选择器之间的优先 ...

  5. CSS选择器优先级总结

    CSS三大特性-- 继承. 优先级和层叠. 继承:即子类元素继承父类的样式; 优先级:是指不同类别样式的权重比较; 层叠:是说当数量相同时,通过层叠(后者覆盖前者)的样式. css选择符分类 首先来看 ...

  6. CSS选择器优先级 CSS权值

    计算指定选择器的优先级:重新认识CSS的权重 标签的权值为 0,0,0,1 类的权值为 0,0,1,0 属性选择的权值为 0,0,1,1  ID的权值为 0,1,0,0 important的权值为最高 ...

  7. 深入理解CSS选择器优先级的计算

    选择器的优先级关系到元素应用哪个样式.在CSS2.1的规范(http://www.w3.org/TR/2009/CR-CSS2-20090908/cascade.html#specificity)中是 ...

  8. 导航栏布局时遇到的问题以及解决办法 css选择器优先级

    得到的导航栏效果 添加#menu ul li{width:30px;} 效果如图 将会使列表项和分隔区域的宽度同时改变因为id选择器的优先级高于类选择器,此时应该为列表项添加内联样式如图 才能得到如下 ...

  9. 前端CSS css引入方式 css选择器 css选择器优先级

    一.       CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表 ...

随机推荐

  1. GridView实现多表头合并[转]

    1.这里先介绍单纯的GridView多表头合并,先上图: 可以看到,上图就是生成的多表头,具体的后台代码是在Row_Created事件中创建的.先看创建代码: protected void GridV ...

  2. C# 多线程处理相关说明: WaitHandle,waitCallback, ThreadPool.QueueUserWorkItem

    class TestThread { static void Main() { //使用WaitHandle静态方法阻止一个线程,直到一个或多个同步对象接收到信号 WaitHandle[] waitH ...

  3. 【JavaScript】前端开发框架三剑客—AngularJS VS. Backone.js VS.Ember.js

    摘要:透过对Github,StackOverflow,YouTube等社区进行数据收集后可知,AngularJS在各大主流社区中都是最受欢迎的,Backbone.js与Ember.js则不相伯仲.本文 ...

  4. Android监听WIFI网络的变化并且获得当前信号强度

    MainActivity如下: package cc.testwifi; import android.os.Bundle; import android.app.Activity; /** * De ...

  5. Android自定义长按事件

    Android系统自带了长按事件,setOnLongClickListener即可监听.但是有时候,你不希望用系统的长按事件,比如当希望长按的时间更长一点的时候.这时候就需要自己来定义这个长按事件了. ...

  6. hadoop集群扩展

    一.先改动master机上的host文件,新增内容 10.61.6.180 slaves15 二.改动master机上hadoop安装文件夹下的conf中的slaves文件.新增内容 slaves15 ...

  7. 0c-41-ARC下循环引用问题

    1.ARC下循环引入问题 一个人拥有一只狗,一只狗拥有一个主人. 当增加d.owner = p;时形成循环引用. 解决方法:一端用strong,一端用weak. 2.ARC下@property参数 A ...

  8. 自学Linux命令的四种方法

    自学Linux命令的四种方法 导读 童鞋们刚接触linux时,在学习过程中中会遇到不少问题,学习linux摸不着头脑,那么下面介绍四种linux的学习方法,特别适合新手. 方法一:终端"每日 ...

  9. 分布式缓存技术redis学习（四）——redis高级应用（集群搭建、集群分区原理、集群操作）

    本文是redis学习系列的第四篇,前面我们学习了redis的数据结构和一些高级特性,点击下面链接可回看 <详细讲解redis数据结构(内存模型)以及常用命令> <redis高级应用( ...

  10. Makefile中指示符“include”、“-include”和“sinclude”的区别

    转:http://www.cnblogs.com/xmphoenix/archive/2012/02/22/2363335.html 指示符“include”.“-include”和“sinclude ...