CSS权重的进制问题
这是复习篇的第一个知识点,(CSS权重进制在IE6为256,后来扩大到了65536。而现代浏览器则采用更大的数量)在说这个知识点之前我们先来看一个例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
div div div div div div div div div div div div p{
color: blue;
}
.aa{
color: red
}
</style>
</head>
<body>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<div>
<p class="aa">颜色</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div> </body>
</html>
这个大家猜一下是什么颜色,可能有的老铁会觉得蓝色啊,后代选择符的权重不是各个选择符的和吗,class选择符权重为0010,而类型选择符权重为0001,12层加起来肯定比0010大,
但是实际上,字体为红色,这里有一个很关键的问题,就是权重的进制是并不是十进制,按照现代浏览器来说,你要写嵌套几万层div字体才会变成蓝色,这非常臃肿了,嵌套几万层,实际工作中也没有哪个铁头娃会这木做吧?要是有,那他可真是个魔鬼。

CSS权重的进制问题的更多相关文章
- 将css 中的16进制颜色, 转化为 rgb格式
对dojo/_base/Color模块的注解. 源地址 https://github.com/robinxiong/dojo/blob/master/_base/Color.js function f ...
- css权重是什么
css权重是什么? 概述 css Specificity中文一般译为css优先级.css权重.相比"权重","优先级"更好理解,mozilla官方中文文档就翻译 ...
- CSS优先级的及其衡量标准CSS权重
一.背景 CSS有三大特性:层叠性.继承性.优先级. 而我们在给CSS定义样式的时候,经常出现两个及以上的规则应用在同一元素上,单该元素最终在浏览器呈现的效果是应用的哪个规则呢?这就要考虑优先级的问题 ...
- Css权重解析
Css权重解析 关于CSS权重,我们需要一套计算公式来去计算,这个就是 CSS Specificity,我们称为CSS 特性或称非凡性,它是一个衡量CSS值优先级的一个标准 具体规范入如下: spec ...
- CSS权重的比较方法
CSS的权重如下: !important Infinity正无穷 行间样式 1000 id 100 class|属性|唯类 10 标签|伪元素 1 通配符 0 256进制 当出现多个 ...
- CSS - 权重,样式优先级
关于CSS权重,一套计算公式来去计算,就是 CSS Specificity,我们称为CSS 特性或称非凡性,它是一个衡量CSS值优先级的一个标准. 遇到样式应用问题,计算一下权重就知道优先级. 具体规 ...
- 主流浏览器内核、css权重
主流浏览器及其内核: IE:trident Firefox:Gecko Google Chrome:webkit/blink Safari:webkit Opera:presto css权重 优先级大 ...
- 关于不同进制数之间转换的数学推导【Written By KillerLegend】
关于不同进制数之间转换的数学推导 涉及范围:正整数范围内二进制(Binary),八进制(Octonary),十进制(Decimal),十六进制(hexadecimal)之间的转换 数的进制有多种,比如 ...
- web安全—浏览器的进制
浏览器的进制 字符的ascii码值可以转化为进制形式.可以用来绕过XSS filter. HTML属性值中的进制使用 .十进制使用a 表示,&#作为前缀,;作为后缀,后缀也可以没有. 如果要使 ...
随机推荐
- webpack学习3.1由浅入深-打包JS
打包JS Step1:在新建的文件夹下新建一个sum.js文件,一个app.js文件 sum.js //es module export default function(a,b){ return a ...
- diff命令的妙用
在读<Writing compilers and Interpreters>一书时需要按章节修改代码,由于实在一行一行比对实在难受,于是想了个办法,利用diff命令比较两章之间代码的修改位 ...
- Python基础-day02-1
判断(if)语句 目标 开发中的应用场景 if 语句体验 if 语句进阶 综合应用 01. 开发中的应用场景 生活中的判断几乎是无所不在的,我们每天都在做各种各样的选择,如果这样?如果那样?-- 程序 ...
- Linux-IO监控
系统级IO监控 iostat 先进行安装 yum install -y sysstat iostat [ options ] [ <interval> [ <count> ] ...
- 微信小程序之启动页的重要性
启动页在APP中是个很常见的需求,为什么对于小程序来说也非常重要呢?首先我描述一下我在开发过程中遇到的一些问题以及解决的步骤,到最后为什么要加启动页,看完你就明白了. 小程序的首页需要展示用户关注的小 ...
- 群晖NAS再再折腾
问题 最近电信把我的公网地址收回去了,之前做好的网络端口映射失效了,在公司已经不能愉快地访问家里的网络.原先网络结构示意图如下: (直接访问方案网络结构图) 只需要对电信光猫(也是个路由器)和家用 ...
- Jupyter修改设置
下载完anaconda后Jupyter默认目录是用户目录,默认浏览器是IE,让有强迫症的我有点难受,所以把它的默认目录和浏览器修改一下. 首先运行一下jupyter notebook --genera ...
- IT兄弟连 HTML5教程 CSS3属性特效 弹性盒模型
CSS3引入了新的盒模型——弹性盒模型,该模型决定一个盒子在其他盒子中的分布方式以及如何处理可用的空间.使用该模型,可以很轻松的创建自适应浏览器窗口的流动布局或自适应字体大小的弹性布局.弹性盒模型看起 ...
- bbbbbb
Blazor 机制初探以及什么是前后端分离,还不赶紧上车? 标签: Blazor .Net 上一篇文章我发了一个 BlazAdmin 的尝鲜版,这一次主要聊聊 Blazor 是如何做到用 C# 来写前 ...
- Nacos Cluster Building
原文链接:https://www.javaspring.net/nacos/nacos-cluster-building Continue to talk about the Nacos build ...