2.1 移動優先與Bootstrap的斷點
On this page
1、什么是移動優先
說到移動優先，先要提一下響應式設計，響應式界面就是設計一個頁面能夠適應不同的設備，響應式設計利用媒體查詢等技術實現不同設備/窗口下的樣式適配，也就是說它會根據你使用的不同設備展示不同的頁面排版給用戶。
這個實現起來就是根據html有個媒體查詢技術，可以獲取屏幕寬度，然后利用css，在不同的寬度下使用不同的css效果即可。
而移動優先就是先開發出一個適合移動客戶端的界面，然后在此基礎上再去根據pc端的情況適配相應的樣式，與之相反的設計思路就是PC優先，選用何種方式根據你的習慣和哪種用戶占得比例多來考慮。現在一般都提倡移動優先。
2、Bootstrap的斷點
所謂的斷點，就是指的臨界點。
這個表格及內容一定要記住，另外特別是那個類中綴，經常會用到。
這個在下一節布局中會詳細演示，在此只需多看幾遍即可，記不住也沒關系，到時候不是可以過來查嘛。。
| 斷點 | 類中綴 | 分辨率 |
|---|---|---|
| X-Small（超小，一般是手機） | None | <576px |
| Small（小，平板或者老筆記本） | sm |
≥576px |
| Medium（中，窄屏電腦） | md |
≥768px |
| Large（大，寬屏電腦） | lg |
≥992px |
| Extra large（超大，寬屏電腦） | xl |
≥1200px |
| Extra extra large（特大，高清電腦或廣告設備） | xxl |
≥1400px |