在實際開發(fā)過程中，需要適配移動端各個設備。通常，設計師給的設計稿是以iphone6為設計基準。

在開發(fā)過程中，發(fā)現在瀏覽器切換時，不能適應各個設備。查找發(fā)現，在其中一個布局中設置了寬度為定寬。例如：我設置width:325px,在iPhone6中是可以的，但是小于320px時是不能適應的。

經過思考，改動如下：
1、width:325px，相對于iPhone6的375寬度占比為86%左右。設置widht:86%;然后，測試果然能夠適應，沒有出現布局超過設備寬度的情況。
2、將布局中能夠使用display:flex的情況下 ，使用該布局方式。可以做到彈性布局。
3、也可以針對特定設備，如：設備寬度為320px，設置媒體查詢
@media (screen < 320) { width: 百分比或定寬；}
4、設置window.addEventlistener('resize', () => {}),通過改變字體大小，結合rem，來動態(tài)改變設備的寬度。即，當設計稿為iPhone6時，設置一個字體大?。ū阌赾ss樣式設置即可），當窗口大小（resize時事件觸發(fā)），由于設備寬度改變，字體大小也發(fā)生改變，相應的根據rem設置的布局也發(fā)生改變，實現了動態(tài)的布局。