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 |