css权重等级
1、问题起因(在一次偶然编写css发现的,.div2 p>.div1 p>.p1,然后做了测试并找查相关资料)


2、解决方案
首先看哪一级的权重高
1、!important,加在样式属性值后,权重值为 10000
2、内联样式,如:style=””,权重值为1000
3、ID选择器,如:#content,权重值为100
4、类,伪类和属性选择器,如: content、:hover 权重值为10
5、标签选择器和伪元素选择器,如:div、p、:before 权重值为1
6、通用选择器(*)、子选择器(>)、相邻选择器(+)、同胞选择器(~)、权重值为0
所以.div1 p的权重值为10+1=11,.div2 p的权重值为10+1=11,.p1的权重值为10
第二看哪一个离p标签的距离近
.p1>.div2 p>.div1 p
所以根据上述分析 .div2 p>.div1 p>.p1
css权重等级的更多相关文章
- CSS权重的等级划分
CSS权重 CSS权重指的是样式的优先级,有两条或多条样式作用于一个元素,权重高的那条样式对元素起作用,权重相同的,后写的样式会覆盖前面写的样式. 权重的等级 可以把样式的应用方式分为几个等级,按照等 ...
- CSS权重;慎用!important
初初接触样式的前端开发者在碰到样式覆盖时,最先选择的往往是!important. 但是这种做法不好,应该优先考虑从样式的级联属性或者位置来解决问题. 切记以下情况永远不要使用!important: 1 ...
- css权重计算方法浅谈
在这之前只知道css权重的皮毛,比如说:行内权重比头部权重高,头部比外部样式权重高----工作中才知道真正理解css权重重要性.理解权重了才能写出来最优css选择器来.对后面学习less,scss有很 ...
- css权重是什么
css权重是什么? 概述 css Specificity中文一般译为css优先级.css权重.相比"权重","优先级"更好理解,mozilla官方中文文档就翻译 ...
- CSS:权重和层叠规则决定了其优先级
首先,给大家看一篇关于CSS优先级的示例:http://www.ido321.com/76.html 一.基本的优先级规则 比较同一级别的个数,数量多的优先级高,如果相同即比较下一级别的个数,至于各级 ...
- css权重及优先级问题
css权重及优先级问题 几个值的对比 初始值 指定值 计算值 应用值 CSS属性的 指定值 (specified value)会通过下面3种途径取得: 在当前文档的样式表中给这个属性赋的值,会被优先使 ...
- CSS优先级的及其衡量标准CSS权重
一.背景 CSS有三大特性:层叠性.继承性.优先级. 而我们在给CSS定义样式的时候,经常出现两个及以上的规则应用在同一元素上,单该元素最终在浏览器呈现的效果是应用的哪个规则呢?这就要考虑优先级的问题 ...
- vue mand-mobile ui加class不起作用的问题 css权重问题
vue mand-mobile ui加class不起作用的问题 css权重问题组件的样式优先权比自己定的class高多加几层权重才行,要直接用样式覆盖也可以在前面多加几层class,定位更精确了才会覆 ...
- css权重 vs 浏览器渲染 -- css之弊病
昨日,突现一个bug,令人十分恼火. 基本场景 自己实现一多选日历,可多选多天(相连或不相连均可)."贵司"的需求真心有些小复杂了,"市面"上没有这样的相似的东 ...
随机推荐
- liteos信号量(八)
1. 概述 1.1 基本概念 信号量(Semaphore)是一种实现任务间通信的机制,实现任务之间同步或临界资源的互斥访问.常用于协助一组相互竞争的任务来访问临界资源. 在多任务系统中,各任务之间需要 ...
- day17_7.19包与logging模块,深浅拷贝
一.包 在模块的定义里,模块就是方法的集合,可以将一些常用的方法封装到一个py文件中,通过调用使用,而且,其中的表现形式也有以包的形式导入. 其实,包就是一系列模块的结合体,表示形式就是一个文件夹,在 ...
- jmeter,学这些重点就可以了
前言 对测试来说,jmeter应该是大家使用较频繁的测试工具之一,因为其开源.免费.轻量.功能强大,支持很多种协议,除了测功能,还能做自动化和性能测试: 据某机构的调查,性能并发工具中,jmeter市 ...
- VIJOS-P1232 核电站问题
VIJOS-P1232 核电站问题 JDOJ 1373 https://neooj.com/oldoj/problem.php?id=1373 题目描述 一个核电站有N个放核物质的坑, ...
- javascript中的e是什么意思?
e 代表事件(event)对象,即所谓的事件驱动源,包含了许多属性和方法.下面以鼠标点击事件为例,作一个测试: (HTML) <!DOCTYPE html> <html> &l ...
- css样式添加错误导致烦扰
省厅和市州 两个ul 之间切换 分别能显示两者对应的内容 但是在做过程中,出现省厅界面有市州的内容… 找了半天,发现是css的问题 layui-show的多添加 算是把首页内容的任务解决了至于c ...
- 【2019.7.26 NOIP模拟赛 T1】数字查找(figure)(数学)
推式子 我们设\(n=kp+w\),则: \[(kp+w)a^{kp+w}\equiv b(mod\ p)\] 将系数中的\(kp+w\)向\(p\)取模,指数中的\(kp+w\)根据欧拉定理向\(p ...
- Linux性能优化实战学习笔记:第四讲
一.怎么查看系统上下文切换情况 通过前面学习我么你知道,过多的上下文切换,会把CPU时间消耗在寄存器.内核栈以及虚拟内存等数据的保存和回复上,缩短进程真正运行的时间,成了系统性能大幅下降的一个元凶 既 ...
- [LeetCode] 154. Find Minimum in Rotated Sorted Array II 寻找旋转有序数组的最小值之二
Suppose an array sorted in ascending order is rotated at some pivot unknown to you beforehand. (i. ...
- php-fpm指定配置文件及php相关配置命令
[root@hostname centos7 sbin]# ./php-fpm -c /usr/local/php/etc/php.ini -y /usr/local/php/etc/php-fpm. ...