Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

第270题(2020-08-03):简述下 css specificity? #273

Open
qappleh opened this issue Aug 3, 2020 · 1 comment
Open

第270题(2020-08-03):简述下 css specificity? #273

qappleh opened this issue Aug 3, 2020 · 1 comment
Labels

Comments

@qappleh
Copy link
Owner

qappleh commented Aug 3, 2020

No description provided.

@qappleh qappleh added the css label Aug 3, 2020
@dinjufen
Copy link

dinjufen commented Aug 3, 2020

CSS优先级:

内联样式 > ID 选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签选择器 = 伪元素选择器
!important 有最高优先级,可以覆盖其他相同属性,但最好不要轻易使用。

具体计算方法为用四个数字表示优先级:

  1. 若有一个id选择器,则在第二位加1,为0, 1, 0, 0

  2. 对于选择器中给定的各个类属性值、属性选择器或伪类,加 0,0,1,0

  3. 对于选择器中给定的各个元素和伪元素,加 0,0,0,1

  4. 第一个数字是内联样式

最后计算得到的数字列表,从左到右依次比较数字大小,若高位胜出,则不用比较低位数字;若高位相等,则继续比较低位数字直到有一方胜出;若两方相等,后者覆盖前者。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants