浏览器是根据权值来判断使用哪种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特殊性——权值规则的更多相关文章

  1. CSS样式权值

    内联样式表(InLine style)>内部样式表(Internal style sheet)>外部样式表(External style sheet) 例外:但如果外部样式表放在内部样式表 ...

  2. css选择器权值

    有的时候我们为同一个元素设置了不同的CSS样式代码,那么元素会启用哪一个CSS样式呢?我们来看一下面的代码: p{color:red;} .first{color:green;} <p clas ...

  3. 【莫队算法】【权值分块】bzoj3920 Yuuna的礼物

    [算法一] 暴力. 可以通过第0.1号测试点. 预计得分:20分. [算法二] 经典问题:区间众数,数据范围也不是很大,因此我们可以: ①分块,离散化,预处理出: <1>前i块中x出现的次 ...

  4. Codevs 1688 求逆序对(权值线段树)

    1688 求逆序对  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 黄金 Gold 题解  查看运行结果     题目描述 Description 给定一个序列a1,a2,…, ...

  5. codevs1688 求逆序对(权值线段树)

    1688 求逆序对  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 黄金 Gold 题解  查看运行结果     题目描述 Description 给定一个序列a1,a2,…, ...

  6. 权值线段树&&可持久化线段树&&主席树

    权值线段树 顾名思义,就是以权值为下标建立的线段树. 现在让我们来考虑考虑上面那句话的产生的三个小问题: 1. 如果说权值作为下标了,那这颗线段树里存什么呢? ----- 这颗线段树中, 记录每个值出 ...

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

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

  8. CSS权值

    选择器权值 标签选择器:权值为1 类选择器和伪类:权值为10 ID选择器:权值为100 通配符选择器:权值为0 行内样式:权值为1000 !important规则: 可调整样式规则的优先级 添加在样式 ...

  9. HTML/CSS权值继承

    <style type="text/css">p{color:red;}.first{color:green;}/*因为权值高显示为绿色*/ span{color:pi ...

随机推荐

  1. gearman的持久化,以mysql的方式

    1.为什么要持久化? gearman的job server中的工作队列存储在内存中,一旦服务器有未处理的任务时重启或者宕机,那么这些任务就会丢失.持久化存储队列可以允许添加后台任务,并将其存储在外部的 ...

  2. 【Linux】关于路由跟踪指令traceroute

      稍有计算机常识的人都知道ping命令,是用来检查自己的主机是否与目标地址接通,自己的主机与目标地址的通讯包通讯速率,所谓的通讯包也就是那些什么TCP/IP,UDP包,这里说得通俗一点,比如,就拿这 ...

  3. BZOJ1001或洛谷4001 [BJOI2006]狼抓兔子

    BZOJ原题链接 洛谷原题链接 显然就是求最小割. 而对于一个平面图有结论,最大流=最小割=对偶图最短路. 所以这题可用最大流或是转换为对偶图求最短路,这里我是用的对偶图. 虽然理论上按上界算,这题\ ...

  4. POJ 3621Sightseeing Cows 0/1 分数规划

    Description 作为对奶牛们辛勤工作的回报,Farmer John决定带她们去附近的大城市玩一天.旅行的前夜,奶牛们在兴奋地 讨论如何最好地享受这难得的闲暇. 很幸运地,奶牛们找到了一张详细的 ...

  5. Ubuntu12.04下Qt连接MySQL数据库

    本文介绍在Ubuntu12.04 (64 bit) 下使用Qt 4.8.2连接MySQL(Ver 14.14 Distrib 5.5.43)数据库. 1.安装 Qt 和 MySQL 若未安装以上软件, ...

  6. 开发中,android手机WIFI无法使用,无SIM卡故障解决

    用eclipse 开发android中,突然出现,android手机WIFI无法使用,无SIM卡故障解决 发现故障后,想办法刷机(没有成功),触点清洁都搞了. 最后恢复出厂设置居然解决了,留资料给同行 ...

  7. sex在软件开发中的运用--SIX技术

    开篇:省略xxx字 keyword:sex . female, male .SIX ,sex integer extention technolgolsl 前言: 对于sex字段的研究,国内,国际尚为 ...

  8. jQuery动画函数回调

    $("#show").click(function () { //function 是显示完成之后的回调函数 $("p").show(2000,function ...

  9. Spring 属性注入(四)属性键值对 - PropertyValue

    Spring 属性注入(四)属性键值对 - PropertyValue Spring 系列目录(https://www.cnblogs.com/binarylei/p/10117436.html) P ...

  10. boost asio 一个聊天的基本框架

    示例代码 #include "Util.h" #include "MyAsio.h" #include "TcpConnectionManager.h ...