Bootstrap 그리드 시스템
Bootstrap3 Grid
http://getbootstrap.com/css/#grid 참조.
– .col-xs- : Phone ( < 768px )
– .col-sm- : Tablets ( ≥768px )
– .col-md- : Desktops ( ≥992px )
– .col-lg- : Desktops ( ≥1200px)
따라서 Mobile, Tablet, Desktop 을 같이 적용하려면 아래의 예제를 참고
<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"></div>
<div class="col-xs-6 col-sm-4">.col-xs-6 .col-sm-4</div>
</div>
References
1 : http://blog.jetstrap.com/2013/08/bootstrap-3-grids-explained/
Array