我们把特殊性分为4个等级,每个等级代表一类选择器,每个等级的值为其所代表的选择器的个数乘以这一等级的权值,最后把所有等级的值相加得出选择器的特殊值。 4个等级的定义如下: 第一等:代表内联样式,如: style=””,权值为1000。 第二等:代表ID选择器,如:#content,权值为100。 第三等:代表类,伪类和属性选择器,如.content,权值为10。 第四等:代表类型选择器和伪元素选择器,如div p,权值为1。 例如上图为例,其中#NAV为二等选择器,.ACTIVE为三等选择器,UL、LI和A为四等选择器。则整个选择器表达式的特殊性的值为1*100+1*10+3*1=113

CSS选择器的权重与优先规的更多相关文章

  1. CSS选择器的权重与优先规则?

    我们做项目的时候,经常遇到样式层叠问题,被其他的样式覆盖,或者写的权重不高没效果,对权重没有具体的分析,做了一个总结. css继承是从一个元素向其后代元素传递属性值所采用的机制.确定应当向一个元素应用 ...

  2. CSS选择器的权重与优先规则

    权重顺序 “important > 内联 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪对象 > 继承 > 通配符”.   原文:http://w ...

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

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

  4. CSS选择器及其权重

    #转载请留言联系 1.标签选择器 标签选择器,此种选择器影响范围大,一般用来做一些通用设置,或用在层级选择器中.举例: div{color:red} ...... <div>这是第一个di ...

  5. css选择器的权重

    权重会叠加!

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

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

  7. css优先级和权重

    1. 权重概念: 权重,是一个相对的概念,是针对某一指标而言.某一指标的权重是指该指标在整体评价中的相对重要程度. 权重系数,是表示某一指标项在指标项系统中的重要程度,它表示在其它指标项不变的情况下, ...

  8. 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧

    记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...

  9. css:id选择器的权重>class选择器的权重=属性选择器的权重>元素选择器

    最近的项目要自己写前端了,重新学习下前端的一下基本知识. 一般在css样式表中,上面的会被下面的覆盖,如下图,文字会显示蓝色: 所以按照正常的来说,下面的css样式,测试的文字应该还是蓝色 但结果,测 ...

随机推荐

  1. 【AMAD】django-model-utils -- Django model使用的mixin和utils

    动机 简介 个人评分 动机 为django model系统提供一些可重用的mixin和utils. 简介 django-model-utils1为Django Model提供了下嘛几种分类的utils ...

  2. eclipse 建立 web fragment project 工程

    1.鼠标右键---------new ---------Other 2.选择WEB----web fragment project 3.输入工程名,点finish

  3. VM Centos 连不上网或者ping不通问题汇总

    首先检查windows关于VM的服务有没有开启.没有开启的都开起来 通过复制形式建立的虚拟机,注意修改网卡地址.和cfg文件的UUID. 虚拟机ip能正常显示但是windows电脑ping不通虚拟机. ...

  4. NLP自然语言处理中英文分词工具集锦与基本使用介绍

    一.中文分词工具 (1)Jieba (2)snowNLP分词工具 (3)thulac分词工具 (4)pynlpir 分词工具 (5)StanfordCoreNLP分词工具 1.from stanfor ...

  5. 云数据库 MariaDB 版

    基于MariaDB企业版全球独家合作认证,提供Oracle兼容性及众多企业级数据库特性.支持包括MySQL InnoDB等多种存储引擎,为不同需求的用户提供灵活的选择. 请看视频简介 优势 Oracl ...

  6. 解决Eclipse发布到Tomcat丢失依赖jar包的问题

    解决Eclipse发布到Tomcat丢失依赖jar包的问题 如果jar文件是以外部依赖的形式导入的.Eclipse将web项目发布到Tomcat时,是不会自动发布这些依赖的. 可以通过Eclipse在 ...

  7. Head First PHP&MySQl第一章代码

    HTML: <!doctype html> <html lang="zh-cn"> <head> <meta charset=" ...

  8. Python-RabbitMQ-direct(广播模式)

    direct绑定模式的,选择性接收 生产者:direct_publiser.py import pika,sys connection = pika.BlockingConnection(pika.C ...

  9. 剑指offer-扑克牌顺子-知识迁移能力-python

    题目描述 LL今天心情特别好,因为他去买了一副扑克牌,发现里面居然有2个大王,2个小王(一副牌原本是54张^_^)...他随机从中抽出了5张牌,想测测自己的手气,看看能不能抽到顺子,如果抽到的话,他决 ...

  10. centos搭建LAMP

    实验环境: [root@nmserver-7 html]# cat /etc/redhat-release CentOS release 7.3.1611 (AltArch) [root@nmserv ...