bootstrap的自适应 和细节点

bootstrap的自适应尽量少用绝对宽度px来定义大小，这会导致缩小屏幕宽度时相冲突，多使用百分比来改变位置。。

遇到不能用margin和padding来改变位置时，首先应该想到绝对定位和相对定位（position），通过定位改变其大小。

bootstrap自适应时如果小分辨率会导致页面失衡，那么加上col-sm-*，不要只加两个自适应（md 和 lg）。

现在要改变的是自己的思维方式，比如div盒子怎么摆放位置，看美工图 首先划分一下div盒子模型，这取决于做一个页面是否能有效、便捷、快速的方法，div盒子划分不正确那么意味着要走很多的不必要的弯路。

有字体图标和文字描述时，可以给字体图标设置display：block  让其占其一行，把文字换行，在让父级元素显示文本居中对齐：text-align：center、

字体图标和文字在ul、li中时，给ul设置弹性布局display：flex，同时设置是否考虑换行，flex-wrap：wrap（wrap默认换行），其中可以给ul设置宽度，但不要设置绝对宽度（px），而设置百分比宽度width：100%；

li中同时设置弹性布局display：flex，为了让字体和图标居中对齐，设置align-item：center，设置字体图标与文字描述的摆放位置，一般设置flex-direction：column；其中可以给li分几等分，比如width：25%，那么就是分成四等分，每份占25%的大小，依此类推。