분류 bootstrap

PC, Table, Mobile 모두를 위한 레이아웃

컨텐츠 정보

  • 조회 2,184 (작성일 )

본문

<div class="container">

    <div class="row">

      <div class="col-xs-12 col-sm-6 col-md-8">.col-xs-12 .col-sm-6 .col-md-8</div>

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

    </div>

    <div class="row">

      <div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>

      <div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>

      <!-- Optional: clear the XS cols if their content doesn't match in height -->

      <div class="clearfix visible-xs-block"></div>

      <div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>

    </div>

</div>