[toc] ## pre 在前端領域，一提到分離，作用一定是便于維護。比方說，樣式和行為分離、前后端分離或則這里的"寬度分離"。 當一件事情的發展可以被多個因素所左右的時候，這個事情最終的結果就會變數很大不可預期。寬度在這里也是類似，由于盒尺寸中的4個盒子都能影響寬度，自然頁面的最終寬度就很容易發生變化而導致意想不到的布局發生。 ## 什么是寬度分離原則 寬度分離，分離，分離，是將`width`與`padding/border/margin`進行分離。 ``` .father{ width:102px; } .son{ border:1px solid; padding:20px; } ```