css选择器权重排序_css选择器优先级高低排列_css样式权重计算和!important属性

首先我们需要知道选择器的类型有这些:选择器栗子ID#id

class.class

标签p

属性[type='text']

伪类:hover

伪元素::first-line

相邻选择器、子代选择器>+

而这些css的选择器是有权重(即优先级)的,在不同选择器的样式出现冲突时候,会采用权重高的选择器设置样式,而优先级不仅仅只是:“行间>内部>外部、ID>class>元素”。css优先级到底是怎么计算的呢?

选择器的特殊性值表述为4个部分,用0,0,0,0表示,权重计算规则如下:行间样式,加1,0,0,0.

ID选择器的特殊性值,加0,1,0,0。

类选择器、属性选择器或伪类,加0,0,1,0。

元素和伪元素,加0,0,0,1。

通配选择器*对特殊性没有贡献,即0,0,0,0。

最后比较特殊的一个标志!important(权重),它没有特殊性值,但它的优先级是最高的,为了方便记忆,可以认为它的特殊性值为1,0,0,0,0。

特殊性值是如何进行比较的呢?比较规则如下:1,0,0,0 > 0,99,99,99。也就是说从左往右逐个等级比较,前一等级相等才往后比。

无论是行间、内部和外部样式,都是按照这个规则来进行比较。而不是直观的行间>内部>外部样式;ID>class>元素。之所以有这样的错觉,是因为确实行间为第一等的权重,所以它的权重是最高的。而内部样式可能一般写在了外部样式引用了之后,所以覆盖掉了之前的。

在权重相同的情况下,后面的样式会覆盖掉前面的样式。

通配符、子选择器、相邻选择器等的。虽然权值为0000,但是也比继承的样式优先,0 权值比无权值优先。

!important属性:

我们知道带有!important的属性样式优先级是最高的,但是ie6中会出现如下的bug:p{

color:red !important;

color:blue; //会显示blue

}

但是这样就会显示的是red。说明ie6还是支持important的p{color:red !important; }

p{color:blue;}

在使用 !important 时需要注意:一定要优化考虑使用样式规则的优先级来解决问题而不是 !important

只有在需要覆盖全站或外部 css(例如引用的 ExtJs 或者 YUI )的特定页面中使用 !important

永远不要在全站范围的 css 上使用!important

永远不要在你的插件中使用 !important

怎样覆盖掉 !important:

很简单,你只需要再加一条!important 的CSS语句,将其应用到更高优先级的选择器(在原有基础上添加额外的标签、class或id选择器)上;或是保持选择器一样,但添加的位置需要在原有声明的后面(优先级相同的情况下,后边定义的会覆盖前边定义的)。#test.a{

color: red !important;

}

a{

color: blue !important;

}

或者,同样的选择器,后边的声明会覆盖前边的:a{

color: red !important;

}

a{

color: blue !important;

}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/552423.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python webdriver save_Python + Selenium +Chrome 批量下载网页代码修改【新手必学】

Python Selenium Chrome 批量下载网页代码修改主要修改以下代码可以调用 本地的 user-agent.txt 和 cookie.txt来达到在登陆状态下 批量打开并下载网页,以网页 ID 来保存为网页文件名PS:很多人在学习Python的过程中,往往因为遇问题解决不了或者没好的教…

sql盲注特点_SQL注入的特点及危害详解

http://www.maiziedu.com/SQL注入的特点及危害详解在网站安全性方面,我们经常会遇到各种各样的安全性问题,SQL注入就是其中最常见的一种,那SQL注入到底有哪些特点呢?一起来看看吧。SQL注入攻击的主要特点1、变种极多有经验的攻击者…

主从式网络的优点_贸泽电子原创开发板大赛【创意奖作品】物联网开发板做成主从机形式,是创意还是多此一举?...

没有创意,竞赛还有什么意义?作为汇集了国内工程师中的一批顶尖高手的设计大赛,本届贸泽电子原创开发板大赛自然少不了“最佳创意奖”,今天,就让我们来看看工程师大开脑洞的获奖作品有何稀奇?奖创意奖《基于…

es 吗 查询必须有sort_ElasticSearch DSL之From/Size,Sort

从这篇文章开始,我们要进入DSL的学习。使用url搜索仅仅是个开始,ES还提供带有查询DSL的请求体用于更高级的搜索。在这些类型的搜索中有大量可选项,可以混合和匹配不同的选项以获得所需的结果。DSL还能根据查询子句的过滤和查询上下文&#xf…

docker mysql配置 丢失_Ubuntu16.04服务器环境配置 – Docker、MySQL、Redis

Ubuntu16.04 服务器环境配置 – Docker、MySQL、Redis安装Docker1. 卸载旧版本sudo apt-get remove docker docker-engine docker.io2. 安装 https 相关的软件包sudo apt-get update # 先更新一下软件源库信息sudo apt-get install apt-transport-https ca-certificates cur…

mysql主从配置_MySQL主从配置详解

主服务器数据库的每次操作都会记录在其二进制文件mysql-bin.xxx(该文件可以在mysql目录下的data目录中看到)中,从服务器的I/O线程使用专用账号登录到主服务器中读取该二进制文件,并将文件内容写入到自己本地的中继日志relay-log文件中,然后从…

mysql 复制方式_MySQL复制方法

MySQL的二进制日志,MySQL复制原理,MySQL主从模式搭建,MySQL双主模式搭建,MySQL级联模式搭建,MySQL半同步模式复制一、二进制日志1、概念MySQL的二进制日志(binary log)是一个二进制文件,主要用于记录修改数…

mysql 主键唯一,MySQL。关键表中的主键。唯一ID还是多个唯一键?

Primary key in relational tables. Composite primary key or unique primary key in those pure relational tables?Which design would you recommend to use in MySQL for high performance? See diagramTechnical advantages and disadvantages!Thanks everyone!解决方案…

mysql以user1登录_在mysql中创建用户后不能本地登录的解决方法

在安装完成MySQL后,我们通常添加拥有相应权限的普通用户用来访问数据库。在使用用户本地登录数据库的时候,经常会出现怎么登录也无法登录的情况,但是从其他的mysql客户端却可以登录。[rootmysql01 ~]# mysql -userver -p123456ERROR 1045 (28000): Acces…

mysql内部时区_一文解决MySQL时区相关问题

前言:在使用MySQL的过程中,你可能会遇到时区相关问题,比如说时间显示错误、时区不是东八区、程序取得的时间和数据库存储的时间不一致等等问题。其实,这些问题都与数据库时区设置有关,本篇文章将从数据库参数入手&…

制作 mysql的rpm文件_自制mysql.rpm安装包

RPM安装比源码更快更方便,更利于统一版本,省去了繁琐的编译过程,下面以制作mysql的rpm安装包为例。编译环境1、 安装rpm-build;检查是否配置rpm环境1 # sudo yum list | greprpm2 This system is not registered with RHN.3 RHN s…

mysql远程授权格式_MySQL远程访问授权

开启 MySQL 的远程登陆帐号有两大步:1、确定服务器上的防火墙没有阻止 3306 端口。MySQL 默认的端口是 3306 ,需要确定防火墙没有阻止 3306 端口,否则远程是无法通过 3306 端口连接到 MySQL 的。如果您在安装 MySQL 时指定了其他端口&#xf…

mysql multi主从复制_mysqld_multi方式配置Mysql数据库主从复制

mysqld_multi设计用于管理在同一台机器上运行的多个mysqld进程,这些进程使用不同的socket文件并监听在不同的端口上。mysqld_multi可以批量启动、关闭、或者报告这些mysqld进程的状态。在这里我们通过这种方式来在同一个机器上启动多个数据库实例,并配置…

mysql 日志节点恢复_基于binlog二进制日志的MySQL恢复笔记

基于binlog二进制日志的MySQL恢复笔记刚好复习到这里,顺手做个小实验,记录下。总的操作流程:step0、关掉数据库的对外访问【防止用户操作继续写入这个库】step1、mysqlbinlog 导出相关时间段数据库的二进制日志step2、编辑today.sql找到误操作…

mysql中if在oracle怎么用_mysql和oracle的mybatis操作

1.Oracle、MySQL插入时返回下一个主键的操作Xml代码 Oracle:SELECT SEQ_ROLE.NEXTVAL AS ID FROM DUALinsert into ROLE(ID, NAME, CREATE, MODIFY) values (#{id}, #{name}, sysdate, sysdate)注意:这边的keyProperty"id"中"id"指的…

mysql数据库的三级模式_2016年计算机三级MySQL数据库试题

2016年计算机三级MySQL数据库试题一、选择题1.E-R图提供了表示信息世界中实体、属性和________的方法。A.数据B.联系C.表D.模式2.数据库系统的核心是________。A.数据模型B.数据库管理系统C.数据库D.数据库管理员3.E-R图是数据库设计的工具之一,它一般适用于建立数据…

python对角线图_python对角线图_python – 在Seaborn Jointplot上绘制对角线(相等的线)...

错误是一个有用的暗示:JointPlot是子图的集合,你必须找到特定的斧头来绘制.修改Seaborn示例:import numpy as npimport pandas as pdimport seaborn as snsfrom matplotlib.pyplot import showsns.set(style"white")# Generate a random corre…

python编程求极限_Sympy笔记一

from IPython.display import displayfrom sympy import *前置知识理解这份笔记的内容需,读者需要具备基础的python知识并且对函数,微积分和矩阵有一定的基础。辅助函数由于后面的笔记中, 我们会大量将一个Sympy object和应用某个函数之后&am…

python语言逆序符号_python的逆序

下面的代码片段可以帮助您完成最后一个任务。如果在字符串的开始或结尾之外的其他地方发现了特殊字符,则对于子集的恢复没有特殊处理。在# Special chars which should be ignored for revertingSPECIALCHARS [ , ., ,]def reverse( string_ ):# Find occurence of…

wpf mysql存储过程_MySQL存储过程的创建及调用

# SQL语句:先编译后执行存储过程(Stored Procedure):一组可编程的函数,是为了完成特定功能的SQL语句集,经编译创建并保存在数据库中,用户可通过指定存储过程的名字并给定参数(需要时)来调用执行。优点(为什么要用存储过…