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 表示,&#作为前缀,;作为后缀,后缀也可以没有. 如果要使 ...
随机推荐
- Test1016
T1 kom (容斥 \((1s32M)\) 给出\(N\)个互不相同的正整数,统计共有多少对数,它们有公共的一个数字(不一定在同一位置上) 输入 第一行一个正整数 \(N (1 ≤ N ≤ 1 00 ...
- EFCore连接池的坑 差点晚年不保
长话短说 上个月公司上线了一个物联网数据科学项目,我主要负责前端接受物联网事件,并提供 参数下载. webapp 部署在Azure云上,参数使用Azure SQL Server存储. 最近从灰度测试转 ...
- oracle创建索引
数据库索引是为了提高查询速度的一种数据结构. 索引的创建语句 索引的创建语句非常简单. CREATE INDEX 索引名 ON 表名(列名); 除了单列索引,还可以创建包含多个列的复合索引. CREA ...
- Spring IoC容器与应用上下文的设计与实现
一.前言 写这篇博文的主要目的如下: 通过相关类和接口分析IoC容器到底长什么样. 阐述笔者对Spring上下文和容器的理解. 介绍重要的类辅助理解SpringBoot的启动流程. 二.Spring ...
- Python核心技术与实战 笔记
基础篇 Jupyter Notebook 优点 整合所有的资源 交互性编程体验 零成本重现结果 实践站点 Jupyter 官方 Google Research 提供的 Colab 环境 安装 运行 列 ...
- python安装pymssql等包时出现microsoft visual c++ 14.0 is required问题无需下载visualcppbuildtools的解决办法
如题,在练习python安装一些包时,出现了microsoft visual c++ 14.0 is required问题.网上有很多资料:一是下载对应的.whl文件,然后pip install安装: ...
- Linux服务器部署.Net Core笔记:一、开启ssh服务
开启ssh服务需要root权限,先用root账户登陆系统 在安装ssh前我们先更新一下yum:yum update 先检查有没有安装ssh服务:rpm -qa | grep ssh 如果没有安装ssh ...
- JS---案例:筋斗云
案例:筋斗云 鼠标进入,一朵云的样式跟随鼠标移动,鼠标点击后离开,云样式回到上次点击的位置 <!DOCTYPE html> <html lang="en"> ...
- TP5 try{}catch{}异常捕获不到 解决办法
问题:TP5用下面的方法, 想要获取抛出的异常捕获不到…… 错误的写法: try{ …… } catch (Exception $e) { echo $e->getMessage(); } 正确 ...
- Axure5.1.0.1699 RP汉化版
Axure是一款产品原型(Prototype)设计软件,可通过这个软件编辑一些常见的事件和在特点条件下才会触发的情况,可以快速的生成HTML Demo页面. 使用Axure的用户很多,据淘宝UED消息 ...