CSS『权重』计算
风吹屁股蛋蛋凉 3/2/2021 11:04:00 AM 825
0
CSS权重
- 优先级从高到底显示
!important>行内样式表>id选择器>类选择器>标签选择器>继承
选择器 |
权值 |
!important |
无穷大 |
行间格式 |
1000 |
id |
100 |
class \ |
属性[type=“text”] \ |
伪类 :hover |
10 |
标签选择器 |
1 |
通配符 |
0 |
CSS选择器
选择器 |
例 |
描述 |
element |
p |
选择所有 <p> 元素 |
element.class |
p.intro |
选择 class=”intro” 的所有 <p> 元素 |
element,element |
div, p |
选择所有 <div> 元素和所有 <p> 元素 |
element element |
div p |
选择 <div> 元素内的所有 <p> 元素 |
element>element |
div > p |
选择父元素是 <div> 的所有 <p> 元素 |
element+element |
div + p |
选择紧跟 <div> 元素的首个 <p> 元素 |
element1~element2 |
p ~ ul |
选择前面有 <p> 元素的每个 <ul> 元素 |
[attribute] |
[target] |
选择带有 target 属性的所有元素 |
[attribute=value] |
[target=_blank] |
选择带有 target=”_blank” 属性的所有元素 |
[attribute~=value] |
[title~=flower] |
选择 title 属性包含单词 “flower” 的所有元素 |
[attribute \ |
=value] |
[lang \ |
=en] |
选择 lang 属性值以 “en” 开头的所有元素 |
[attribute^=value] |
a[href^=”https”] |
选择其 src 属性值以 “https” 开头的每个 <a> 元素 |
[attribute$=value] |
a[href$=”.pdf”] |
选择其 src 属性以 “.pdf” 结尾的所有 <a> 元素 |
[attribute*=value] |
a[href*=”w3schools”] |
选择其 href 属性值中包含 “abc” 子串的每个 <a> 元素 |
:nth-child(n) |
p:nth-child(2) |
选择属于其父元素的第二个子元素的每个 <p> 元素。 |
:nth-last-child(n) |
p:nth-last-child(2) |
同上,从最后一个子元素开始计数 |
:nth-of-type(n) |
p:nth-of-type(2) |
选择属于其父元素第二个 <p> 元素的每个 <p> 元素 |
:nth-last-of-type(n) |
p:nth-last-of-type(2) |
同上,但是从最后一个子元素开始计数 |
:not(selector) |
:not(p) |
选择非 <p> 元素的每个元素 |
:empty |
p:empty |
选择没有子元素的每个 <p> 元素(包括文本节点) |
共 0 条评论