2020-09-13

结构性伪类选择器 (style)

1:a标签中第一个儿子b采用此样式
a b:first-child{color:red}
2:a标签中最后一个儿子b采用此样式
a b:flast-child{color:red}
3:a标签中唯一的一个儿子b采用此样式
a b:only-child{color:red}
4:a标签中第三个儿子b采用此样式
a b:nth-child(3){color:red}
5:a标签中奇数儿子b采用此样式
a b:fnth-child(odd){color:red}
6:a标签中偶数儿子b采用此样式
a b:fnth-child(even){color:red}

结构性伪类选择器(倒叙)

1:从下往上数a标签的第奇数个儿子b采用此样式
a b:nth-last-child(odd){border:1px solid red}
2:从下往上数a标签的第偶数数个儿子b采用此样式
a b:nth-last-child(even){border:1px solid red}
3:从下往上数a标签的第4个儿子b采用此样式
a b:nth-last-child(4){border:1px solid red}
4:从下往上数a标签的第一个儿子b采用此样式
a b:first-child{border:1px solid red}