[css] display:flex flexbox 학습 2

지난 포스팅에 flexbox 의 기본 개념을 학습할 수 있는 게임과 개념들을 소개했다.

그리고 이번엔 flexbox의 속성을 이용해 디펜스 게임을 할 수 있는 링크를 소개하려 한다.

 

http://www.flexboxdefense.com/

Flexbox Defense

 

Level 1의 시작화면

tower-group-1의 영역으로 잡힌 곳에 적절한 css 속성을 추가해 tower 들이 보라색들을 공격해 점수를 따내는 게임이다

 

각 레벨을 클리어하지 않아도 다음 레벨, 심지어 마지막 레벨까지도 바로 진행할 수 있다는게 약간 의욕을 떨어뜨리는 포인트이지만..!

전략게임을 좋아하고 flexbox를 더 능숙히 연습하고 싶은데 좀 더 재밌게 할 방법을 찾는다면! 아주 좋은 게임이 될 듯하다!

 

참고로 레벨 12의 첫 화면이다.

레벨 1과 차원이 차원이 다르게 복잡할 것 같다! 언젠가 다 클리어하면 클리어한 화면을 캡쳐해보리!