记录:CSS特殊性——权值规则
浏览器是根据权值来判断使用哪种css样式的,权值高的就使用哪种css样式。
下面是权值的规则:
标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100。例如下面的代码:
p{color:red;} /*权值为1*/
p span{color:green;} /*权值为1+1=2*/
.warning{color:white;} /*权值为10*/
p span.warning{color:purple;} /*权值为1+1+10=12*/
#footer .note p{color:yellow;} /*权值为100+10+1=111*/
我们来思考一个问题:如果在html文件中对于同一个元素可以有多个css样式存在并且这多个css样式具有相同权重值怎么办?好,这一小节中的层叠帮你解决这个问题。
层叠就是在html文件中对于同一个元素可以有多个css样式存在,当有相同权重的样式存在时,会根据这些css样式的前后顺序来决定,处于最后面的css样式会被应用。
css样式优先级: 内联样式表(标签内部)> 嵌入样式表(当前文件中)> 外部样式表(外部文件中)。
重要性
我们在做网页代码的时,有些特殊的情况需要为某些样式设置具有最高权值,怎么办?这时候我们可以使用!important来解决。
注意:!important要写在分号的前面
这里注意当网页制作者不设置css样式时,浏览器会按照自己的一套样式来显示网页。并且用户也可以在浏览器中设置自己习惯的样式,比如有的用户习惯把字号设置为大一些,使其查看网页的文本更加清楚。这时注意样式优先级为:浏览器默认的样式 < 网页制作者样式 < 用户自己设置的样式,但记住!important优先级样式是个例外,权值高于用户自己设置的样式。
记录:CSS特殊性——权值规则的更多相关文章
- CSS样式权值
内联样式表(InLine style)>内部样式表(Internal style sheet)>外部样式表(External style sheet) 例外:但如果外部样式表放在内部样式表 ...
- css选择器权值
有的时候我们为同一个元素设置了不同的CSS样式代码,那么元素会启用哪一个CSS样式呢?我们来看一下面的代码: p{color:red;} .first{color:green;} <p clas ...
- 【莫队算法】【权值分块】bzoj3920 Yuuna的礼物
[算法一] 暴力. 可以通过第0.1号测试点. 预计得分:20分. [算法二] 经典问题:区间众数,数据范围也不是很大,因此我们可以: ①分块,离散化,预处理出: <1>前i块中x出现的次 ...
- Codevs 1688 求逆序对(权值线段树)
1688 求逆序对 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题解 查看运行结果 题目描述 Description 给定一个序列a1,a2,…, ...
- codevs1688 求逆序对(权值线段树)
1688 求逆序对 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题解 查看运行结果 题目描述 Description 给定一个序列a1,a2,…, ...
- 权值线段树&&可持久化线段树&&主席树
权值线段树 顾名思义,就是以权值为下标建立的线段树. 现在让我们来考虑考虑上面那句话的产生的三个小问题: 1. 如果说权值作为下标了,那这颗线段树里存什么呢? ----- 这颗线段树中, 记录每个值出 ...
- CSS选择器优先级 CSS权值
计算指定选择器的优先级:重新认识CSS的权重 标签的权值为 0,0,0,1 类的权值为 0,0,1,0 属性选择的权值为 0,0,1,1 ID的权值为 0,1,0,0 important的权值为最高 ...
- CSS权值
选择器权值 标签选择器:权值为1 类选择器和伪类:权值为10 ID选择器:权值为100 通配符选择器:权值为0 行内样式:权值为1000 !important规则: 可调整样式规则的优先级 添加在样式 ...
- HTML/CSS权值继承
<style type="text/css">p{color:red;}.first{color:green;}/*因为权值高显示为绿色*/ span{color:pi ...
随机推荐
- B+树与B-树
前面已经介绍过B-树,接下来,我们主要介绍一下B+树. 1.B+树的概念 B+树是应文件系统所需而生的一种B-树和变形树.一棵m阶B+树和m阶的B-树的差异在于: (1)有n棵子树的结点中含有n个关键 ...
- 1F - A+B for Input-Output Practice (III)
Your task is to Calculate a + b. Input Input contains multiple test cases. Each test case contains a ...
- Zookeeper简介与使用
1. Zookeeper概念简介: Zookeeper是一个分布式协调服务:就是为用户的分布式应用程序提供协调服务 A.zookeeper是为别的分布式程序服务的 B.Zookeeper本身就是一 ...
- hdu 5326(基础题) work
http://acm.hdu.edu.cn/showproblem.php?pid=5326 一道水题,题目大意是在公司里,给出n个员工和目标人数m,然后下面的n-1行是表示员工a管理b,问在这些员工 ...
- 在iOS中将string转成UTF-8编码
在iOS开发中,特别是在对Web服务调用的时候,经常会遇到请求参数为中文的情况,那么这时候就需要将Url转成UTF-8编码才能进行请求.使用stringByAddingPercentEscapesUs ...
- Luogu 3119 [USACO15JAN]草鉴定Grass Cownoisseur
思路很乱,写个博客理一理. 缩点 + dp. 首先发现把一个环上的边反向是意义不大的,这样子不但不好算,而且相当于浪费了一次反向的机会.反正一个强连通分量里的点绕一遍都可以走到,所以我们缩点之后把一个 ...
- libpcap 库使用(二)
参考资料: http://www.tcpdump.org/manpages/pcap.3pcap.html 分类介绍了该lib的函数 Opening a capture handle for read ...
- 看起来像是PS的照片,实际上却令人难以置信!
图片来源:网络 在现实生活中 很多照片看起来不可思议 就像经过PS处理的一样. 今天就跟随米醋一起来感受一下 看这些超现实的真实照片. 一张感光过度的照片, 让狗的头看起来像是悬浮的. 一只被困在琥珀 ...
- boost timer代码学习笔记
socket连接中需要判断超时 所以这几天看了看boost中计时器的文档和示例 一共有五个例子 从简单的同步等待到异步调用超时处理 先看第一个例子 // timer1.cpp: 定义控制台应用程序的入 ...
- reduce 之 mixin实现
语法: arr.reduce(callback[, initialValue]) 参数: callback:执行数组中每个值的函数,包含四个参数: accumulator:累加器累加回调的 ...