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%的大小，依此類推。