Bootrap是web前端CSS框架。它是基于css3和html5開發(fā)的，，它在jquery基礎(chǔ)上進(jìn)行完善。形成自己的風(fēng)格，并兼容大部分的Jquery插件。 bootstrap現(xiàn)有第四版。變化從Less到Sass，不支持IE，合并了所以HTML resets到一個(gè)新的模塊，重寫了所以的JS插件。Bootstrap包含了豐富的web組件，還自帶了13個(gè)Jquery插件。模塊代碼，可以對(duì)Bootstrap中的所以CSS變量進(jìn)行修改，根據(jù)自己的需求剪切代碼。Bootstrap Less是一個(gè)CSS預(yù)處理器，讓CSS具有動(dòng)態(tài)性，也可以在CSS中使用Less變量，mixins(混合)，nesting(嵌套)。 形式如下：
<div class="wrap"> <div ?class="row"> <div class="col-md-3">3</div> <div class="col-md-6">6</div> <div class="col-md-3">3</div> </div> 柵格一行最多為12列，若<12，則剩余的部分空白。若>12，多余的部分在下一行另起。 <div ?class="row"> <div class="col-md-3">3</div> <div class="col-sm-6">6</div> <div class="col-xs-6">6</div> </div> </div> 其中，md/sm/xs的意思是，當(dāng)頁(yè)面定義了一個(gè)臨界值，當(dāng)>臨界值時(shí)，一行的格子會(huì)水平排列。當(dāng)<臨界值時(shí)，一行格子會(huì)垂直排列。 xs的臨界是768（<手機(jī)）；sm的臨界是992（<平板）；md的臨界是1200(<桌面) 故xs總是水平排列的。 900px
1080px .col-md-offset-x;是將列偏移到右側(cè)X個(gè)距離。 col-md--push-x是列平移。

?

轉(zhuǎn)載于:https://www.cnblogs.com/lvxiaojie/p/5017842.html

總結(jié)

以上是生活随笔為你收集整理的Bootstrap简介及Bootstrap里的栅格系统col-md/sm/xs-x;的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。