
http://flukeout.github.io/
CSS Diner라는 사이트인데요.
깃헙 페이지를 통해서 퍼블리싱한 사이트입니다.
CSS Selector를 게임처럼 배울 수 있는 곳 입니다.
enter 버튼이 보이는 줄에 들썩들썩 움직이는 녀석들을
골라 낼 수 있는 코드를 넣어 주면됩니다.

접시에 마우스를 가져다 대면 그 움직이는 물체의 컴포넌트를 볼 수 있습니다.
지금은 접시가 움직이고 있으니
plate라고 입력하고 enter!
다음으로 넘어가면,

bento 박스만 골라내라고 하네요.
이런식으로 움직이는 물체들을 골라내고 enter로 진행하면서
CSS Selector를 공부하게 됩니다.
즐거운 공부가 되겠네요.
즐거운 개발 되시길 바라요~
댓글 없음:
댓글 쓰기