CSS优先级别计算
a、b、c、d,可以以这四种等级为依据确定CSS选择器的优先级:
a-----style 行内样式 个数 +1000
b-----id 个数+100
c-----类 个数+10
d-----类型个数+1
!important 规则是例外,级别高于一切
| 选择器 | 特殊性(a,b,c,d) | 优先级 |
|---|---|---|
| style=" " | 1,0,0,0 | 1000 |
| #wrapper #content{} | 0,2,0,0 | 200 |
| #content .date{} | 0,1,1,0 | 110 |
| div#content{} | 0,1,0,1 | 101 |
| #content{} | 0,1,0,0 | 100 |
| p.comment.date{} | 0,0,2,1 | 21 |
| div.comment p{} | 0,0,1,2 | 12 |
| .comment p{} | 0,0,1,1 | 11 |
| p.comment{} | 0,0,1,1 | 11 |
| .comment{} | 0,0,1,0 | 10 |
| div p{} | 0,0,0,2 | 2 |
| p{} | 0,0,0,1 | 1 |
练习下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>练习</title>
<style type="text/css">
.box a{color:000;}
</style>
</head> <body>
<div id="wrap">
<div class="box">
<p><a href="#">把这里改为红色</a></p>
</div>
</div>
</body>
</html>
把能想到的都发在评论里吧~
CSS优先级别计算的更多相关文章
- CSS网页布局错位:CSS宽度计算
为什么计算宽度计算网页像素宽度是为了CSS网页布局整齐与兼容.常见的我们布局左右结构网页或使用padding.margin布局的时候将计算整页宽度,如果不计算无论是宽度过大过小就会出现错位问题. 怎么 ...
- css优先级计算规则
原文:css优先级计算规则 最近面试了一些求职者,我问css优先级计算规则是怎样的?答曰ID优先级>class>元素选择器,外联样式优先级低于内联样式,内联样式优先级低于行间样式,然后就没 ...
- 关于CSS的优先级,CSS优先级计算
原则一: 继承不如指定原则二: #id > .class > 标签选择符原则三:越具体越强大原则四:标签#id >#id ; 标签.class > .class CSS优先级权 ...
- Vue 学习笔记 — css属性计算的问题
简书 今天在使用Vue时遇到一个问题:在切换css内联属性时某些特殊属性的计算会有问题,无法得到预期的结果. 例子: https://jsfiddle.net/blqw/cLwau40z/ 上面的页面 ...
- css优先级计算规则——权重
一.css的优先级 当对同一个元素设置相同的多个声明时,会按照优先级的高低选择应用哪种声明. <style> #id{ color:red; } p{ color:blue; } < ...
- 关于CSS的优先级,CSS优先级计算,多个class引用
原则一: 继承不如指定 原则二: #id > .class > 标签选择符 原则三:越具体越强大 原则四:标签#id >#id ; 标签.class > .class CSS优 ...
- js访问CSS最终计算样式
所谓计算样式,就是嵌入式样式.外部样式表.内联样式综合的样式表现,那么如何来获取呢? "DOM2 级样式"增强了document.defaultView,提供了getCompute ...
- css优先级计算
主要的css选择器有id,class,tag,[],:,::等,而通常需要对其优先级进行判断的有id,class,tag,另外内联样式和!important也和css的优先级有关系. 如果将这五种不同 ...
- css rem计算
先抛出一个问题:为什么要选择rem? px:像素是相对于显示器屏幕分辨率而言的相对长度单位.pc端使用px倒也无所谓,可是在移动端,因为手机分辨率种类颇多,不可能一个个去适配,这时px就显得非常无力, ...
随机推荐
- ! cocos2d 预编译重复
由于预编译文件重复,导致下面的类没有被编译,所以,在写代码的时候也没有提示还报错,说LoadingScene没有定义. #ifndef __HELLOWORLD_SCENE_H__ #define _ ...
- 一致性 hash 算法
consistent hashing 算法早在 1997 年就在论文 Consistent hashing and random trees 中被提出,目前在 cache 系统中应用越来越广泛: 1 ...
- C++ Split string into vector<string> by space
在C++中,我们有时候需要拆分字符串,比如字符串string str = "dog cat cat dog"想以空格区分拆成四个单词,Java中实在太方便了,直接String[] ...
- #undef
#undef 是在后面取消以前定义的宏定义 该指令的形式为 #undef 标识符 其中,标识符是一个宏名称.如果标识符当前没有被定义成一个宏名称,那么就会忽略该指令. 一旦定义预处理器标识符,它将保持 ...
- 微博java SDK介绍及使用说明
转自:作者:新浪微博 开放平台 @MUNTO_AKIRA http://open.weibo.com/blog/%E5%BE%AE%E5%8D%9Ajava-sdk%E4%BB%8B%E7%BB%8D ...
- C#中将ListView中数据导出到Excel
首先 你需要添加引用Microsoft Excel 11.0 Object Library 添加方法:选择项目->引用->右击“添加引用”->选择COM 找到上面组件—>点击“ ...
- elFinder的使用并整合ckeditor
具体实现访问: 白乔大神资源:https://github.com/bluejoe2008/elfinder-2.x-servlet 本人oschina的库:https://git.oschina.n ...
- 【iM_TFTRGB液晶模块】demo例程(版本1.02)发布
============================== 技术论坛:http://www.eeschool.org 博客地址:http://xiaomagee.cnblogs.com 官方网店:h ...
- 分布式文件系统FastDFS原理介绍
在生产中我们一般希望文件系统能帮我们解决以下问题,如:1.超大数据存储:2.数据高可用(冗余备份):3.读/写高性能:4.海量数据计算.最好还得支持多平台多语言,支持高并发. 由于单台服务器无法满足以 ...
- 揪出Android流氓软件
揪出Android流氓软件 http://www.icpcw.com/Smartphone/Android/Android/1471/147142_all.htm http://www.william ...