Space
article thumbnail
Published 2023. 4. 22. 22:28
[CSS] Flex practice site CSS
반응형

게임으로 배우는 CSS Flex (Flexbox Froggy)

 

https://flexboxfroggy.com/#ko

 

Flexbox Froggy

A game for learning CSS flexbox

flexboxfroggy.com

 

게임으로 CSS Flex를 공부할 수 있는 사이트를 발견했습니다.

Flex를 사용하여 개구리들을 연잎 위로 옮겨주시면 되는 아주 간단한 게임입니다.

 

총 24단계로 되어있고,

Flex(1), Flex(2)를 충분히 이해하셨다면 어렵지 않을 거라 생각합니다.

 

문제를 푸는데 많이 막히신다면

다시 한 번 Flex(1), (2)를 복습하고 오시길 권장해 드립니다.

 

 

Flex(1)

https://ghvhdh321.tistory.com/entry/CSS-Flex-container

 

[CSS] Flex container에 적용하는 속성들

[CSS] Flex(1) 공부한 내용을 리마인드하면서 정리하였습니다. (feat. VScode) Flex contatiner에 적용하는 속성들에 알아보기에 앞서 Flex의 기본적인 성향에 대해 알아보겠습니다. 중심축, 메인축 (main axis)

ghvhdh321.tistory.com

 

Flex(2)

https://ghvhdh321.tistory.com/entry/CSS-Flex-item

 

[CSS] Flex item에 적용하는 속성들

[CSS] Flex (2) [CSS] Flex item에 적용하는 속성들에 대해 알아보겠습니다. 공부한 내용을 리마인드 하면서 정리하였습니다. (feat. VScode) Flex item에 적용하는 속성들에 알아보기에 앞서 아직 Flex container

ghvhdh321.tistory.com

 


 

 

Flex practice site를 알아보는 시간이었습니다.

틀린 내용은 댓글로 알려주시면 감사하겠습니다.

 

 

반응형
profile

Space

@Space_zero

포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!