게임을 통한 CSS Selector 연습
@웹학교 님이 올려주신 https://sir.kr/cm_free/1499973 소모임에 정리해 봅니다.
https://github.com/flukeout/css-diner
16번, 17번, 19번은 좀더 봐야겠네요.
16번은
자식이 only-child로
17번은 검색을 해보니 여러가지 답이 가능하지만, last-child로만으로 되네요..
19번: https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-last-child
앞에 나오는 엘레먼트가 무조건 마지막에 있어야 되고.. 중간에 같은 엘레먼트가 아니어도 카운트는 됨.
시간이 되면 https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors
이것 기준으로 몇가지 더 추가하면 좋을 것 같습니다.
|
댓글을 작성하시려면 로그인이 필요합니다.
댓글 5개
<bento/>
<plate />
<plate>
<orange />
<orange />
<orange />
</plate>
<bento>
<orange />
<orange />
</bento>
<pickle class="small" />
bento위에 orange 2개는 안올라가네요(한개만 보임)
<plate>
<orange/>
<orange/>
</plate>
<bento>
<orange/>
<orange/>
</bento>
<plate id="fancy"/>
이런 구성으로 해서 plate아래 orange중하나 선택하게
<apple for="Alexei" />
<bento for="Albina"><apple /></bento>
<bento for="Vitaly"><orange/></bento>
<plate for="Vitaly"><orange/></plate>
<pickle/>
이렇게 해야...