モバイル（767px以下）	エクストラスモール=xs	col-xs-*
タブレット（768px以上、991px未満）	スモール=sm	col-sm-*
デスクトップ（992px以上、1199px未満）	ミディアム=md	col-md-*
デスクトップ（1200px以上）	ラージ=lg	col-lg-*

bootstrapの12分割HTML例

サムネイルの大きさを画面幅によって変える

<!-- rowで囲む-->
<div class="row">

<div class="col-xs-12 col-sm-4 col-md-3 col-lg-2">
～サムネイル1～
</div>

<div class="col-xs-12 col-sm-4 col-md-3 col-lg-2">
～サムネイル2～
</div>

<div class="col-xs-12 col-sm-4 col-md-3 col-lg-2">
～サムネイル3～
</div>

<div class="col-xs-12 col-sm-4 col-md-3 col-lg-2">
～サムネイル4～
</div>

</div>
<!-- /rowで囲む-->