CSS特性 & CSS优先级算法

最新推荐文章于 2022-01-17 10:16:17 发布
最新推荐文章于 2022-01-17 10:16:17 发布
阅读量464 收藏
点赞数
分类专栏： CSS 文章标签： 权重 继承
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/luyu13141314/article/details/53516605
版权

CSS特性

  • 层叠性
  • 继承性
  • 优先级

CSS层叠性

在css样式中，与样式的调用顺序无关，与样式的定义顺序有关。

层叠性：浏览器解析CSS是从上至下，当CSS冲突时以最后定义的CSS为准

CSS继承性

继承性（顾名思义：子承父业）：子元素没有设置样式，那么该子元素受父元素的样式影响。

哪些属性可以继承？

color、width、text-开头的、line-开头的、font-开头的

  • 这些关于文字样式的，都能够继承。
  • 所有关于盒子的、定位的、布局的属性都不能继承。
  • 继承性是从自己开始，直到最小的元素。
  • 继承的特殊标签： a标签 标题标签（如h1）不会实现继承

CSS优先级

定义CSS样式时，经常出现两个或更多规则应用在同一元素上，这时就会出现优先级的问题。

!important > 内联样式 > ID > 类 | 伪类 | 属性选择 > 标签 | 伪元素 > 继承 > 通配符

权重是优先级的算法，具体怎么计算看下文。在考虑权重时，需要注意一些特殊情况：

  • 继承的权重为0 ( 即在嵌套结构中，不管父
最低0.47元/天 解锁文章
喝着绿茶的猫
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
层叠、继承、css权重优先级的计算
weixin_43183219的博客
12-27 337
css层叠、继承、权重优先级的介绍以及实例演示
前端面试题——11.CSS样式的优先级？
qq1722377628的博客
10-14 478
分祖先样式和自身样式 如果既有祖先样式又有自身样式，采取就近原则。 栗子： <head> <style> .father{ color: red } </style> </head> <body> <div class="father"> <div style="color:blue">颜色</di...
CSS三大特性之优先级
shwanglp的专栏
12-03 723
 CSS三大特性之优先级 概念：当多个选择器选中同一个标签，并且给同一个标签设置同一个属性时，如何层叠就由优先级来决定。 顺序： ！important>行内样式>id选择器>类选择器>标签选择器>通配符>继承->默认样式 test body{ color: red; } p{
CSS优先级
ximingx
01-17 197
概念： 定义CSS样式时，经常出现两个或更多规则应用在同一元素上，此时， 选择器相同，则执行层叠性 选择器不同，就会出现优先级的问题。 权重计算公式 标签选择器 计算权重公式 继承或者 * 0,0,0,0 标签选择器 0,0,0,1 每个类，伪类 0,0,1,0 每个ID 0,1,0,0 每个行内样式 style="" 1,0,0,0 每个!important 重要的 ∞ 无穷大 值从左到右，左面的最大，一级大于一级，数位之间没有进制，级别之间不可超越。 权
css权重与样式的优先级(十)
unlockmyname的博客
06-09 159
css的优先级与权重(重点) 目的: 在定义css样式时,经常会出现多个规则应用在同一个元素上,这时会出现优先级问题. 直接总结: css特殊性(specificity):用一个四位的数字串来表示,值从左到右,左做大,一级比一级大,数位之间没有进制关系. 继承或者* 的贡献值 0,0,0,0 每个元素（标签）贡献值为 0,0,0,1 每个类，伪类贡献值为 0,0,1,0 每个ID贡献值为 0,1,0,0 每个行内样式贡献值 1,0,0,0 每个!important贡献值
css优先级规则
zhengzhengwang的专栏
06-12 774
css优先级规则： 1.先从高等级进行比较，高等级相同时，再比较低等级的，以此类推； 2.完全相同的话，就采用 后者优先原则（也就是样式覆盖）； 3.css属性后面加 !important 时，无条件绝对优先（比内联样式还要优先）； 权值等级划分， 一般来说是划分4个等级： 第一等级：代表 内联样式，如 style=""，权值为 1,0,0,0； 第二等级：代表 ID选择器，如 #id="", 权值为 0,1,0,0； 第三等级：代表 calss | 伪类 | 属性 选择器，如 .class | :hov.
CSS规则层叠时的优先级算法
10-30
CSS 规则的优先级是Web前端开发人员必须理解的一个概念，我们常用的添加样式的方法有4种。
CSS优先级算法如何计算？有哪些判定规定及计算方式
12-13
CSS 的specificity 特性或称非凡性，它是一个衡量CSS值优先级的一个标准，既然作为标准，就具有一套相关的判定规定及计算方式，specificity用一个四位的数 字串(CSS2是三位)来表示，更像四个级别，值从左到右，左面...
CSS优先级计算的规则
09-24
主要介绍了CSS优先级计算的规则,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
彻底弄懂CSS选择器以及优先级
01-08
一种优先级算法 内联样式表的权值最高 (style=””) 权值为1000 统计选择符中的ID属性个数。（#id） 权值为100 统计选择符中的CLASS属性个数。(.class) 权值为10 统计选择符中的HTML标签名个数。 {例如：p} 权值为1 ...
css选择器优先级顺序是什么？css基本选择器优先级的介绍
weixin_48161032的博客
05-18 2695
css的选择器有很多种，那么，自然而然的就会有优先级这一概念出现，所以，css选择器优先级顺序是怎样的呢？本篇文章将来给大家介绍css选择器优先级的排序，话不多说，我们来直接看正文内容。 在看css选择器优先级顺序前，我们先来简单说说css基本选择器有哪些？ 1、标记选择器（如：body,div,p,ul,li） 2、id选择器（如：id=“name”,id=“name_txt”） 3、类选择器（如：id=“name”,id=“name_txt”） 4、后代选择器（如：#head .nav ul li 从父
CSS的优先级
weixin_30778805的博客
05-21 98
ID选择器(形如#id{}) > 类选择器(形如.class{}) > 标签选择器(形如body{}或者*｛｝)，也就是ID选择器，类选择器，标签选择器中，ID选择器的优先级最高，标签选择器最低 选择器越具体优先级就越高，也就是.classA .classB .classC{font-size: 25px;}.classB .classC{font-size:18px}.clas...
CSS优先级（重点）
匆匆过客
10-12 242
## 5.3 CSS优先级（重点） - 概念： 定义CSS样式时，经常出现两个或更多规则应用在同一元素上，此时， * 选择器相同，则执行层叠性 * 选择器不同，就会出现优先级的问题。 #### 1). 权重计算公式 关于CSS权重，我们需要一套计算公式来去计算，这个就是 CSS Specificity（特殊性） 标签选择器 计算权重公式 继承或者 * 0,0,0,0 每个元素（标签选择器） 0,0,0,1 每个类，伪类 0,0,1,0 ...
关于CSS的规则优先级
xwv
10-23 180
      在CSS中，如果某个元素可以匹配中多条样式规则时，如何判定使用哪一条规则，这就是一个优先级问题？       带着这个问题，在Google中找到下面这篇web，对上面的问题，做了一番解释。现在转贴于下，作为了解的起点。       CSS规则层叠时的优先级算法 CSS 规则的优先级是Web前端开发人员必须理解的一个概念，我们常用的添加样式的方法有4...
css优先级汇总
weixin_34242331的博客
11-12 95
　　我所理解的css优先级：当两个或者多个样式作用于同一个元素时，就会出现css优先级的问题。 　　多重样式优先级：当内联样式、内部样式和外部样式作用于同一个元素时，属于多重样式的范畴。优先级的顺序为内联样式>内部样式>外部样式。 <head> <link href="style.css" rel="stylesheet" type="text/css" /...
前端基础学习之CSS第一天
weixin_52049630的博客
11-01 103
前端基础学习之CSS第一天 一、CSS网页美容师又叫做层叠/级联样式表，主要用作于是美化页面，布局页面。 CSS通常写在HTML的上面 <head> <meta charset="UTF-8" /> <title>这是我的网页</title> <style> css写在这里面 </style> </head> 二、CSS选择器 1.标签选择器：把想要调整的标签选出来，进行样式调整。 优点：只能设置所选择表签内
CSS的优先级规则
weixin_30701521的博客
12-03 147
CSS的优先级规则有两类 1.位置群组规则 最高优先级为元素内嵌的style样式，如<div style=” “></div> 次高优先级为html头部中的<style>标签里面的样式 第三高优先级为通过头部<style>里面@import导入的样式表 第四优先级为通过<link>标签外链的样式表 第五优先级为<link...
css样式优先级
linman0310的博客
02-27 440
相同权值情况下: css样式的优先级别是(从高至低)：内联样式表（标签内部）> 嵌入样式表（当前文件中）> 外部样式表（外部文件中）。（就近原则） 权值不同时: 浏览器是根据权值来判断使用哪种css样式的，哪种样式权值高就使用哪种样式。 下面是权值的规则： 标签的权值为1，类选择符的权值为10，ID选择符的权值最高为100。例如下面的代码： p{color:red;} /*
css选择器优先级算法如何计算
最新发布
03-23
CSS选择器优先级算法是根据选择器中各种选择器的数量和类型来计算的。选择器中ID选择器的数量最高，其次是类选择器和属性选择器，最后是标签选择器。如果选择器中有通配符、子选择器、伪类或伪元素，它们也会增加...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值