CSSDiner笔记
练习CSS
●1、2
○元素选择器
○plate和bento
●3
○id选择器
○#fancy
●4
○后代选择器
■元素后代元素
■元素亲??元素
○plateapple
●5
○混合后代选择器、id选择器
○#fancypickle
●6
○类选择器
○.small
●7
○交集选择器，元素+类，多个选择器在?起，没有空格，若有元素选择器要放在前?
○orange.small
●8
○后代选择器，?为元素，?为交集选择器（元素+类）
○bentoorange.small
●9
○并集选择器，逗号连接
○plate,bento
●10
○通配选择器，*
1
●11
○后代选择器+通配选择器
○plate*
●12
○兄弟选择器，元素紧邻且?元素相同。
■两种兄弟选择器，+，选择的是+后?的，单个。~表示某元素后?所有同级的指定元素，可
以多个。
○plate+apple
●13
○~兄弟选择器
○bento~pickle
●14
○亲??后代选择器，
○plateapple
●15
○伪类选择器，选择第1个后代，.container:first-child
○plate:first-child
●16
○伪类选择器，唯??元素，:only-child
○plate:only-child
●17
○并集选择器，伪类选择器，li:last-child为li中最后?个元素
○apple:last-child,pickle:last-child
●18
○伪类选择器，p:nth-child(x)第x个p
○plate:nth-child(3)
●19
○伪类选择器，p:nth-last-child(x)倒数第x个p
○bento:nth-last-child(3)
●20
○伪类选择器，p:first-of-type，匹配的是某?元素下相同类型?元素中的第?个
○apple:first-of-type
2
●21
○?类伪元素，p:ntn-of-type(2n)，匹配的是p中为偶数次序。
○plate:nth-of-type(even)
●22
○plate:nth-of-type(2n+3)，从第3个开始（包含），选择每两个
●23
○plateapple:only-of-type，盘?上唯??个苹果
●24
○apple:last-of-type,orange:last-of-type
●25
○bento:empty，不包含?元素
●26
○apple:not(.small)，取?
●27
○属性值选择器
○[for]
●28
○plate[for]
●29
○[forVitaly]
●30
○[for^Sa]属性值匹配前缀
●31
○[for$ato]属性值匹配后缀
●32
○[for*obb]属性值匹配中间部分
3