? ? ? ? 標題屬于偷懶的結果，實際上本文內容定位并不算是對于bootstrap的入門。畢竟大家都很聰明，bootstrap上手也是沒啥門檻的。所以本文其實是基于個人的對bootstrap的一些認識以及過往開發經驗中的積累，來說說bootstrap的特點、某些用法以及需要注意的地方。另，本文是在默認讀者對于bootstrap已有初步了解，或者至少粗略看完過bootstrap官方文檔的情況下來編寫的，請知悉。
一，開發中的相關規范及技巧
1，頭部meta標簽以及兼容性相關
2，柵格系統的使用
? ? ? ? bootstrap中柵格系統通過給元素添加col-*類來實現，col類共有四種類型：
? ? ? .? col-xs-*? ? .? col-sm-*? ? ? .? col-md-*? ? .? col-lg-*
? ? ? 它們是通過設置的尺寸分割臨界點來產生作用的，也就是說，如果你只給當前元素添加了其中的某一種class名，它可能只會在這種尺寸區間產生預期的效果，而不能保證其他size的顯示設備時的排版效果。下圖示例說明：
圖1，示例代碼塊（部分css代碼沒在圖片內）；
圖2，屏幕寬度 < 992px時（即col-sm-*/col-xs-*）;
圖3，屏幕寬度 > 992px時（即col-md-*/col-lg-*）;
3，多顯示設備下的柵格使用
? ? ? ?多種尺寸的柵格排版也可能會有個性化的排版要求，因此我們可以對同一個div設置多個不同類型的柵格class來實現不同的排版效果；還有就是針對不同尺寸屏幕的顯示內容的變化，也可以通過添加visible-*/hiddden-*的class來實現。
4，柵格內容區
a，模塊化內容區。
? ? ? ? 用模塊化的方式去構建項目時，模塊最外層不應該有規定柵格的class，而是應該在使用該模塊的頁面中去做柵格排版，這樣就保證了模塊的多處不一樣排版情況下復用的可能。當然模塊內部可以有自己的柵格劃分，模塊內有柵格的話，最外層div應該有row這個class，如圖：
b，容器內的單位設置。
? ? ? ? 因為bootstrap作為響應式的框架，其柵格的寬度是一個變化值。所以我們在排版上盡量做到用柵格去切割排列，而少用我們常見的inline-block，float，margin等去做；但是針對一些特定設計，我們用柵格無法達到排版效果時，我們也應該盡量少去給容器設置固定的width；多用百分比，或者sass中的計算函數來實現，當然能直接在bootstrap中找到組件就更好了（如media組件）。
5，阻止最小縮放尺寸
? ? ? ? ?如果不禁止響應式，只是限制在電腦和平板使用，可以通過給container加min-width來限制，然后其他步驟同上相應改變即可。
6，行列的使用規范
? ? ? ? ?為了內容在顯示上的規范及一致性，我們在布局柵格系統時應該嚴格按照規范去書寫和嵌套。
a，單層嵌套必須包裹在container和row內；
b，多層嵌套則必須在內部柵格外包裹一層row；
c，盡量不要去更改某一處的row或col-*的左右margin或者padding，容易引起排版錯亂或內容區不齊整；
d，某些列的偏移，或者較大間距（大于默認間距）的，善用col-offset-*/col-pull-*/col-push-*的class來實現；
二，項目前期規范相關
1，源碼相關；
下載bootstrap整個工程文件，用未壓縮的代碼先進行個性化定制，然后再壓縮引用；
還有bootstrap中的mixin文件等代碼可以復用，方便我們開發；
bootstrap的scss文件結構，代碼劃分方式，包括具體代碼中變量/塊代碼/色值函數等代碼的書寫都是非常好的模板，值得我們去研究學習。
一旦我們定制化的文件確定后，之后所有改源碼的行為應該讓大家都知悉；
業務代碼中覆蓋源碼的行為應該做限定生效區域，避免污染全局；
2，項目css代碼文件結構
? ? ? ? 按照我們既定的方案，手機端和平板/電腦端分兩套代碼去開發，為的是更個性化的開發需求實現以及代碼質量保障。但是兩套代碼處于同一開發目錄下，所以我們有必要在兩套代碼的css文件結構上多加考量。目前我個人考慮的結構大致如下：
|---scss
|---|---public? ? ? ? ? ? ? ? ? ? ? ? ? ? ------>公共樣式的目錄
? ? ? ? ? ? |---mixin.scss? ? ? ? ? ? ?
? ? ? ? ? ? |---color.scss
? ? ? ? ? ? |---size.scss
|---|---mobile ? ? ? ? ? ? ? ? ? ? ? ? ? ------>手機端的全局公共樣式
|---|---pc ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ------>平板和PC端全局公共樣式
? ? ? ? 如目錄所示，我們在scss目錄下分三個文件夾，分別是整個項目的公共樣式，手機端的公共樣式，pc的公共樣式。至于其他的具體的scss文件，我們按模塊放在具體模塊下就好。
? ? ? ? ?暫時就寫這么多，以后想到會再補充。
