부트 스트랩 그리드 시스템

부트 스트랩 그리드 시스템

부트 스트랩의 그리드 시스템은 페이지 전체에 최대 12 개의 컬럼을 허용합니다.

12 개의 열을 모두 개별적으로 사용하지 않으려면 열을 그룹화하여 더 넓은 열을 만들 수 있습니다.



부트 스트랩의 그리드 시스템이 반응하며 화면 크기에 따라 열이 자동으로 재 배열됩니다.

그리드 클래스
부트 스트랩 그리드 시스템에는 4 개의 클래스가 있습니다.

xs (전화 용)
sm (태블릿 용)
md (데스크톱 용)
lg (대형 데스크탑 용)
위의 클래스를 결합하여보다 동적이고 유연한 레이아웃을 만들 수 있습니다.

부트 스트랩 그리드의 기본 구조
다음은 부트 스트랩 그리드의 기본 구조입니다.

<div class="row">
<div class="col-*-*"></div>
</div>
<div class="row">
<div class="col-*-*"></div>
<div class="col-*-*"></div>
<div class="col-*-*"></div>
</div>
<div class="row">
...
</div>
먼저; 행 ( <div class="row">)을 만듭니다 . 그런 다음 원하는 수의 열 (적절한 .col-*-*클래스가있는 태그)을 추가하십시오 . .col-*-*각 행에 대한 숫자 는 항상 최대 12 개가되어야합니다.

아래에서는 기본적인 부트 스트랩 그리드 레이아웃 예제를 수집했습니다.