![]()
1단계 #pond { display: flex; justify-content: flex-end; } 2단계 #pond { display: flex; justify-content: flex-end; } 3단계 #pond { display: flex; justify-content: space-around; } 4단계 #pond { display: flex; justify-content: space-between; } 5단계 #pond { display: flex; align-items: flex-end; } 6단계 #pond { display: flex; justify-content: center; align-items: center; } 7단계 #pond { display: flex; justify-con..
![]()
Flexbox flexbox는 items을 금 긋기(열, 행을 긋기) 위한 표면적인 레이아웃 방법이다. 페이지의 콘텐츠 상자 안에 아이템을 배치하는 데 사용된다. 페이지의 콘텐츠 상자 안에 아이템을 배치하는 데 사용된다. flexbox는 1차원 레이아웃을 만드는데 사용할 수 있는 CSS 속성의 집합 flexbox의 주요 아이디어는 conatiner 요소 내부의 빈 공간이 자식 요소에 의해 자동으로 나눔 flexbox를 사용하면 부모 container 내부에서 수평 및 수직으로 항목을 자동으로 정렬 가능 flexbox는 수직 정렬 및 동일한 높이의 열 생성과 같은 일반적인 문제를 해결한 flexbox는 floats를 바꾸는데 완벽하고, 더 적은 코드와 HTML과 CSS를 깔끔하게 작성 float에 대해서 ..
