CSS Diner
정답
1) 모든 plate 선택
plate
2) 모든 bento 선택
bento
3) id가 fancy인 요소 선택
#fancy
4) plate안의 apple 모두 선택
plate apple
5) id가 fancy인 요소 안의 모두 pickle 선택
#fancy pickle
6) class가 small인 요소 모두 선택
.small
7) class가 small인 요소들 중 orange 모두 선택
orange.small
8) bento안의 small orange 모두 선택
bento orange.small
9) palte, bento 모두 선택
plate,bento
10) 모두 선택
*
11) plate안의 요소들 모두 선택
plate *
12) plate 바로 뒤의 첫번째 apple 모두 선택
plate+apple
13) bento 바로 뒤의 pickle 모두 선택
bento~pickle
14) plate안에 있는 apple 모두 선택
plate>apple
15) orange의 첫 번째 orange 선택
orange:first-child
16) plate안의 요소가 오직 하나만 있을 때 해당 요소 모두 선택
plate :only-child
17) class가 small인 요소들 중 마지막에 있는 요소 모두 선택
.small:last-child
18) 앞에서 부터 3번째 요소가 plate인 요소 모두 선택
plate:nth-child(3)
19) 끝에서 부터 3번째 요소가 bento인 요소 모두 선택
bento:nth-last-child(3)
20) apple들 중 첫 번째 모두 선택
apple:first-of-type
21) 6개의 plate 중 짝수번째 plate 모두 선택
plate:nth-of-type(even)
22) 6개의 plate 중 3,5번째 plate 모두 선택
plate:nth-of-type(2n+3) /3번째를 포함하여 시작해서 +2번째인(5)요소 선택/
23) apple이 오직 하나만 있을 때 해당 요소 모두 선택
apple:only-of-type
24) small인 요소 중 마지막에 있는 요소 모두 선택
.small:last-of-type
25) bento 중 비어있는 bento 모두 선택
bento:empty
26) small이 아닌 apple 모두 선택
apple:not(.small)
27) attribute가 for인 요소 모두 선택
[for]
28) plate안의 attribute가 for인 요소 모두 선택
plate[for]
29) bento안의 attribute가 for이면서 값이 Vitaly인 요소 모두 선택
bento[for="Vitaly"]
30) attribute가 for이면서 값이 S로 시작하는 요소 모두 선택
[for^="S"]
31) attribute가 for이면서 값이 o로 끝나는 요소 모두 선택
[for$="o"]
32) attribute가 for이면서 값에 b가 들어가는 요소 모두 선택
[for*="b"]
