1. 实例演示选择器权重,并写出详细计算过程 2. 实例演示常用伪类选择器,并写出参数计算过程

1. 实例演示选择器权重,并写出详细计算过程

id: 百位
class: 十位
tag: 个位

如：

body h1 {
    color: violet;
}

计算过程

它的id为0，class为0，tag为2。所以它的权重就是 : 0,0,2

---

!important: 是最高指示,忽略任何权重

h1 {
    color: chartreuse !important;
}

2. 实例演示常用伪类选择器,并写出参数计算过程

:nth-of-type(an+b)

1. a: 系数, [0,1,2,…]
2. n: [0,1,2,3,….]
3. b: 偏移量, 从0开始
   注: 计算出来的索引,必须是有效, 从1开始

.list> :nth-of-type(-n + 3) {
    background-color: lightgreen;
}

参数计算过程

/ -10 + 3 = 3
-11 + 3 = 3-1 = 2
-12 + 3 = 3-2 = 1
-1*3+3 = 3-3 = 0

[3,2,1] */

.list> :nth-of-type(odd) {
    background-color: lightgreen;
}
.list> :nth-of-type(even) {
    background-color: lightgreen;
}

odd为奇数, even为偶数。