• 회원가입
  • 로그인
  • 구글아이디로 로그인

[grid] BS3 - Grid - Medium (BS그리드 중형기기 이상) - col-md-숫자

BS3 Grid : Medium

  Extra Small Small Medium Large
Class 접두어 .col-xs .col-sm .col-md .col-lg
화면 너비 <768 >=768 >=992px >=1200px

 

 

col-md-* 예제1sm, md 혼용

(sm 미만 수직) → (sm 이상 3:9) → (md 이상 6:6)

 

<div class="container-fluid">  

  <div class="row">

    <div class="col-sm-3 col-md-6">...</div>

    <div class="col-sm-9 col-md-6">...</div>

  </div>

</div>


결과 보기

 

col-md-* 예제2md만 사용

(md 미만 수직) → (md 이상  6:6)

 

<div class="container-fluid">  

  <div class="row">

    <div class="col-md-6">...</div>

    <div class="col-md-6">...</div>

  </div>

</div>


결과 보기



분류 제목
grid BS3 - Grid (그리드) - 반응형 레이아웃 ★★★
grid BS3 - Grid (.container / .container-fluid) - 그리드 (박스형/와이드형)
grid BS3 - Grid - Small (BS그리드 소형기기 이상) - col-sm-숫자
grid BS3 - Grid - Medium (BS그리드 중형기기 이상) - col-md-숫자
grid BS3 - Grid - Large (BS그리드 대형기기 이상) - col-lg-숫자
grid BS3 - Grid Examples (그리드 예제) ★★★★★
grid BS3 - grid CSS (BS그리드CSS = BS반응형CSS = BS노출CSS) + BS프린트클래스 ★★…
목록
찾아주셔서 감사합니다. Since 2012