부트 스트랩 스태킹 순서 재정렬

Question

부트 스트랩 그리드에 관한 질문이 있습니다. 나는 그리드를 가지고 있는데, 데스크톱 브라우저 모드에서 행 1과 2, 열 A, B, C가있는 Excel을 상상해보십시오.

desktop to stacked

난 A1, A2, B1, B2, C1, C2의 순서 (위에서 아래로)로 이동 모드 적층 '셀'재정렬 할. 나는 수업을 당기고 보았지만 위와 같은 것은하지 않습니다. 누구든지 그것을 달성하는 방법을 조언 할 수 있습니까?

다른 유사한 답변을 찾았지만 정확하게 내 문제와 일치하는 것은 없습니다.

감사합니다,

LB

Answer 1

체크 아웃이 구조. 3 열을 만들어야하고 각 열 내부에 행에 전체 너비 열이 추가됩니다. 따라서 작은 화면에서는 첫 번째 열에서 마지막 열로 스태킹을 시작합니다.

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<div class="row"> 
 
    
 
    <div class="col-sm-3"> 
 
    <div class="row"> 
 
     <div class="col-xs-12"> 
 
      A1 
 
     </div> 
 
     <div class="col-xs-12"> 
 
      A2 
 
     </div> 
 
    </div> 
 
    </div> 
 
    
 
    <div class="col-sm-3"> 
 
    <div class="row"> 
 
     <div class="col-xs-12"> 
 
      B1 
 
     </div> 
 
     <div class="col-xs-12"> 
 
      B2 
 
     </div> 
 
    </div> 
 
    </div> 
 
    
 
    <div class="col-sm-3"> 
 
    <div class="row"> 
 
     <div class="col-xs-12"> 
 
      C1 
 
     </div> 
 
     <div class="col-xs-12"> 
 
      C2 
 
     </div> 
 
    </div> 
 
    </div> 
 

 

 
</div>