Css的优先级机制
样式的优先级
多重样式(Multiple Style):如果外部样式、内部样式、内联样式同时应用于同一个元素，就是使用多重样式的情况。
一般情况优先级如下：
(外部样式)External style sheet <(内部样式)Internal style sheet <(内联样式)Inline style
有一个例外的情况，就是如果外部样式放在内部样式的后面,则外部样式将覆盖内部样式。
示例如下:
| <head> |
| <style type="text/css"> |
| /* 内部样式 */ |
| h3{color:green;} |
| </style> |
| <!-- 外部样式 style.css --> |
| <link rel="stylesheet" type="text/css" href="style.css"/> |
| <!-- 设置：h3{color:blue;} --> |
| </head> |
| <body> |
| <h3>测试！</h3> |
| </body> |
选择器的优先级：
内联样式表的权值最高1000,
ID选择器的权值为100，
class类选择器的权值为10，
html标签选择器的权值为1
CSS优先级法则:
A选择器都有一个权值：权值越大越优先。
B当权值相等时，后出现的样式表设置要优先于先出现的样式表设置。
C网页编写者设置的css样式的优先权高于浏览器设置的样式
D继承的CSS样式不如后来指定的CSS样式
E在同一组属性设置中标有"!important"规则的优先级最大；
| <html> |
| <head> |
| <style type="text/css"> |
| #redP p{ |
| /*两个color属性在同一组*/ |
| color:#00f !important; /* 优先级最大 */ |
| color:#f00; |
| } |
| </style> |
| </head> |
| <body> |
| <div id="redP"> |
| <p>color</p> |
| <p>color</p> |
| </div> |
| </body> </html> |
Css的优先级机制的更多相关文章
- CSS 的优先级机制[总结]
样式的优先级 多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况. 一般情况下,优先级如下: (外部样式)External styl ...
- CSS 的优先级机制总结
一.样式优先级: 多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使用多重样式的情况. 一般情况下,大家都认为优先级是:内联样式 > 内部样 ...
- CSS 样式优先级
首先,选择器优先级顺序 优先级逐级增加的选择器列表: 通用选择器(*) 元素(类型)选择器 类选择器 属性选择器 伪类 ID 选择器 内联样式 !important 规则例外,该样式声明会覆盖CSS中 ...
- css中的继承、层叠、样式优先级机制
一.继承与层叠:
- css优先级机制说明
原文:css优先级机制说明 首先说明下样式的优先级,样式有三种: 1. 外部样式(External style sheet) 示例: <!-- 外部样式 bootstrap.min.css -- ...
- CSS 之 样式优先级机制
多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况. 1.一般情况下,优先级从低到高,如下: 浏览器缺省(即浏览器默认) →(外部样 ...
- css优先级机制
所谓CSS优先级,即是指CSS样式在浏览器中被解析的先后顺序. 1.important >(内联样式)Inline style >(内部样式)Internal style sheet ...
- css的优先级 和 权重
之前写页面样式时,有时会遇到 用多条样式定义规则对同一个元素进行样式设置的时候,当时想到的就是 按css选择器的优先级来搞定这个问题,说实话当时也就只记得 内嵌样式 > id > cla ...
- CSS选择器优先级总结
CSS三大特性-- 继承. 优先级和层叠. 继承:即子类元素继承父类的样式; 优先级:是指不同类别样式的权重比较; 层叠:是说当数量相同时,通过层叠(后者覆盖前者)的样式. css选择符分类 首先来看 ...
随机推荐
- 入门干货之Grpc的.Net实现-MagicOnion
此文章简单残暴,学习成本较低,你可以跟着我一起撸代码,一起吐槽,一起砸键盘.以下操作均为 core2.0 环境. 0x01.Grpc 1.介绍 Google主导开发的RPC框架,使用HTTP/2协议 ...
- java 重定向和转发的区别
注:原创链接 http://www.cnblogs.com/shenliang123/archive/2011/10/27/2226892.html response.sendredirect(&q ...
- 常见的Linux 的命令
rm命令 -f :就是force的意思,忽略不存在的文件,不会出现警告消息 -i :互动模式,在删除前会询问用户是否操作 -r :递归删除,最常用于目录删除,它是一个非常危险的参数 如: rm -i ...
- offsetWidth相关js属性
js你真的了解offsetWidth吗 offsetWidth是什么? 答:它可以获取物体宽度的数值 那么就只是这样吗! html部分 <div id="div1"> ...
- android支付宝app支付(原生态)-包括android前端与java后台
本文讲解了 android开发的原生态app集成了支付宝支付, 还提供了java后台服务器处理支付宝支付的加密代码, app前端与java后台服务器使用json数据格式交互信息,java后台服务主要用 ...
- isupper()函数
isupper()函数可以用来判断字符c是否为大写英文字母! 原型:extern int isupper(int c); 头文件:ctype.h 功能:判断字符c是否为大写英文字母 说明:当参数c为大 ...
- HDU 1728 逃离迷宫(DFS经典题，比赛手残写废题)
逃离迷宫 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submis ...
- [HDU3247]Resource Archiver
AC自动机+状压DP 首先对所有串建AC自动机,然后对于每个资源串,算出从串末走到其他资源串末所需的距离(中途避开非法点) 也就是算出两两间的距离...然后就变成旅行商问题了. 计算距离的时候要考虑一 ...
- 几道数位DP
因为这几天写的几道数位DP大多都太水..而且也确实没什么好讲所以就扔到一起了. [hdu4772]Good Numbers 要求统计区间内 各位数之和能被10整除 的数的个数. 练手,f[i][j][ ...
- ucosii --任务就绪表
任务就绪表的任务就是高效的找出当前优先级最高的就绪任务. 由任务就绪表OSRdyTbl和任务就绪组OSRdyGrb组成,OSRdyTbl每一个位都记录着一个任务的就绪状态, 0非就绪1就绪,OSRdy ...