본문 바로가기
  • purple-whale
LIBRARY/Bootstrap

Bootstrap - container (컨테이너)

by purple-whale purple-whale 2021. 1. 23.

Fixed Container 고정 컨테이너

 .container 

: 반응형 고정 너비 컨테이너를 제공

너비(max-width)가 화면의 크기에 따라서 바뀝니다.

  매우작음
<576px
작은
≥576px
중간
≥768px
대형
≥992px
초대형
≥1200px
최대너비 100% 540px 720px 960px 1140px

 

 

 

Fixed Container 유동 컨테이너

 .container-fluid 

: 뷰포트의 전체 너비에 걸쳐있는 전체 너비 컨테이너를 제공

항상 화면의 전체 너비를 꽉채우는 컨테이너를 만듭니다.

 

Fixed padding

컨테이너 상하단에 패딩 없이 좌우에 15px 패딩이 적용됩니다.

클래스넹임을 추가하여 간격 유틸리티를 사용할 수 있습니다.

<div class="container pt-3"></div>

 

 

 

 

'LIBRARY > Bootstrap' 카테고리의 다른 글

Bootstrap - container (컨테이너)  (0) 2021.01.23
Bootstrap link 하기  (0) 2021.01.23

댓글0