Grid 2

[CSS Framework] Grid Utilities

Helper 클래스 콘텐츠를 정렬할 수 있는 좋은 유틸리티 부트스트랩은 flexbox 용어를 사용한다. flexbox 기반으로 만들어졌기 때문이다. flexbox, align-items 교차축에서 작동하며 flexbox를 만든다. 콘텐츠를 수직 정렬할 때 적용할 수 있는 옵션이다. Grid Aligment Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aperiam molestiae sit, tempore unde porro voluptates est fugit. Reiciendis exercitationem officiis aliquam minus corrupti quaerat omnis commodi dolore ipsum consequatur..

[CSS Framework] Bootstrap | Grid System

Grid System 그리드 시스템을 통해 부트스트랩을 사용할 때 웹페이지에서 콘텐츠를 배열할 수 있다. 공간 분배를 화면 크기에 따라 달라지게 하는 반응형 레이아웃을 만들 수 있게 도와준다. 그리드 시스템은 컨테이너 안에서만 작동한다. 그리드를 사용하려면 항상 컨테이너 클래스가 있어야 한다. 행(row)클래스를 사용해서 행을 만들어야 한다. 부스트트랩의 모든 행에는 분배될 공간이 12유닛씩 있다. 옆의 사진처럼 동일한 세 개의 열이 있는 경우 각각의 열에 4유닛씩 동일하게 분배된다. 행에다 열(Coloumn)을 만들어야 한다. 주어진 행에서 분배하려는 모든 부분이 행이 된다. 모든 열의 클래스는 col 클래스로 시작한다. 공간을 분배하는 방법: 클래스를 사용해 col- 뒤에 숫자를 사용하면 된다. Th..

728x90