Bootstrap 3열을 여러 행으로 확장하는 방법은 무엇입니까?

여러 행에 걸쳐 Bootstrap 열 확장

Bootstrap을 사용하여 그리드 레이아웃을 만드는 것은 간단한 작업일 수 있습니다. 그러나 한 열이 여러 행에 걸쳐 있어야 하는 문제에 직면하면 다소 당황스러울 수 있습니다. 이 가이드에서는 Bootstrap 3을 사용하여 이를 달성하는 방법을 보여줍니다.

Bootstrap 3용 솔루션:

Bootstrap 3에서 두 행에 걸쳐 있는 열을 만들려면 다음을 따르세요. 단계:

<div class="row">
  <div class="col-md-4">
    <div class="well">
      1
      <br>
      <br>
      <br>
      <br>
      <br>
    </div>
  </div>
  <div class="col-md-8">
    <div class="row">
      <div class="col-md-6">
        <div class="well">
          2
        </div>
      </div>
      <div class="col-md-6">
        <div class="well">
          3
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-md-6">
        <div class="well">
          4
        </div>
      </div>
      <div class="col-md-6">
        <div class="well">
          5
        </div>
      </div>
    </div>
  </div>
</div>

설명:

이 HTML 코드에서는 2행 그리드를 생성합니다. 첫 번째 행에는 4개의 단위에 걸쳐 있는 하나의 열이 포함되어 있고, 두 번째 행에는 각각 2개의 단위에 걸쳐 있는 2개의 열이 포함되어 있습니다. 첫 번째 행의 열은 중첩된 행 구조에 포함되지 않기 때문에 두 행에 걸쳐 있습니다.

위 내용은 Bootstrap 3열을 여러 행으로 확장하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!