boottstrap 3 중 container 와 containerfluid 외층 용기 의 차이 설명

1555 단어 bootstrap3containerfluid
.container 와.containerfluid 는 boottstrap 의 두 가지 서로 다른 유형의 외층 용기 입 니 다.공식 적 으로 말 하면 이 두 가지 차이 점 은:
.container 클래스 는 폭 을 고정 시 키 고 응답 식 레이아웃 을 지원 하 는 용기 입 니 다.
.container-fluid 류 는 100%너비 로 모든 시점(viewport)을 차지 하 는 용기 입 니 다.
고정 폭 이란 개발 자가 스스로 용기 의 폭 을 설정 할 수 있 도록 하 는 것 이 아니 라 boottstrap 내부 에서 화면 너비 에 따라 미디어 조 회 를 이용 하여 고정 폭 을 설정 하고 적응 할 수 있 도록 하 는 것 입 니 다.
도,그리고 스스로 적응 할 수 있다.어떤 경우 에 도 응답 식 레이아웃 의 바깥쪽 레이아웃 용기 에 고정 폭 을 수 동 으로 설정 하지 마 십시오.
.container-fluid 는 자동 으로 외부 창의 100%로 설정 합 니 다.만약 에 외부 창 이 body 라면 전체 화면 을 표시 합 니 다.화면 크기 에 관 계 없 이 응답 식 레이아웃 을 자동 으로 실현 합 니 다.
다음은 참고 코드 입 니 다.참고 하 시기 바 랍 니 다.

/*0-768px    container 100%*/
.container {
 padding-right: 15px;
 padding-left: 15px;
 margin-right: auto;
 margin-left: auto;
}
/*768-992px    container 750px*/
@media (min-width: 768px) {
 .container {
 width: 750px;
 }
}
/*992-1200px    container 970px*/
@media (min-width: 992px) {
 .container {
 width: 970px;
 }
}
/*1200px    container 1170px*/
@media (min-width: 1200px) {
 .container {
 width: 1170px;
 }
}
/*container-fluid 100%*/
.container-fluid {
 padding-right: 15px;
 padding-left: 15px;
 margin-right: auto;
 margin-left: auto;
}
총결산
위 에서 말 한 것 은 소 편 이 소개 한 boottstrap 3 중 container 와 container 입 니 다.fluid 외부 용기 의 차이 점 에 대한 설명 은 여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 메 시 지 를 남 겨 주세요.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!
php 디 렉 터 리 옮 겨 다 니 기 방법 소결
php 쿠키 암호 화 방법

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage