다중 및 / 또는 중첩 된 부트 스트랩 컨테이너?

다중 및 / 또는 중첩 된 부트 스트랩 컨테이너?

---

내 이해 는 모든 Bootstrap 스타일 요소가 요소 내부에 있어야한다는 것 <div class="container">입니다. 하지만 때때로 여러 "컨테이너"가있는 부트 스트랩 예제를 볼 수 있습니다.

<div class="container">
    <!-- Blah, GUI stuff, blah -->
</div>

...

<div class="container">
    <!-- Blah, more GUI stuff, blah -->
</div>

내 질문 :

1. 여러 "컨테이너 div"가있는 단일 HTML 페이지가 언제 필요할까요? 하나의 큰 "컨테이너 div"안에 몸 전체를 넣는 것과는 대조적으로 어떤 이점이 있습니까?
2. "컨테이너 div"를 다른 내부에 중첩하고 싶습니까? 언제 / 왜?

---

1. 페이지의 일부 섹션은 전체 뷰포트 너비에 걸쳐 있고 다른 섹션은 그렇지 않습니다. 일부 배경은 전체 너비이지만 콘텐츠는 그렇지 않습니다.

   이에 대한 예는 뷰포트의 전체 너비 인 배경 이미지 또는 색상이 있지만 그 내부의 콘텐츠, 형태 등이 .container주어진 뷰포트 너비를 초과하지 않는 특징 영역입니다.

2. 당신은 중첩하지 .container않거나 .container-fluid- 문서를 참조하십시오 . 필요하지 않다.

   문서 : 부트 스트랩은 사이트 콘텐츠를 감싸고 그리드 시스템을 수용하기 위해 포함 요소가 필요합니다. 프로젝트에 사용할 두 개의 컨테이너 중 하나를 선택할 수 있습니다. 패딩 등으로 인해 어느 컨테이너도 중첩 가능하지 않습니다. [.container 및 .container-fluid가 중첩되지 않는다는 의미도 아닙니다].

---

일부 말한 달리 둥지 캔 container-fluid, 안쪽을 container. 공식 부트 스트랩 웹 사이트에도 예가 있습니다.

http://getbootstrap.com/examples/navbar/

---

실제로 그것은 전적으로 디자이너의 요구 사항에 달려 있습니다.

때로는 행의 전체 너비가 필요합니다 (즉, 별도의 컨테이너 클래스없이 얻을 수있는 뷰포트 또는 가시적 부분의 스트립을 의미합니다)

http://binarytheme.com/demos?theme=bootsrap-landing-page-blue

이해하려면 위의 템플릿 예제를 참조하십시오.

---

4.3 문서의 레이아웃 섹션 인 https://getbootstrap.com/docs/4.3/layout/overview/#containers 에서 이제 다음과 같이 표시됩니다.

컨테이너 는 중첩 될 수 있지만 대부분의 레이아웃에는 중첩 된 컨테이너가 필요하지 않습니다.

다른 사람들이 패딩 등에 대해 언급 한 내용에 유의하십시오.

참고 URL : https://stackoverflow.com/questions/26469332/multiple-and-or-nested-bootstrap-containers