如上圖所示梅屉，一個標準的盒模型由四個部分組成：margin（外邊距）、border（邊框）、padding（內(nèi)邊距）锅很、content（內(nèi)容）。
margin控制盒子與盒子的間距盼铁，padding控制邊框與內(nèi)容的間距粗蔚。
padding會改變盒子的大小，但不會改變內(nèi)容的大小饶火，因此在設置盒模型的大小時要考慮到padding的影響鹏控。
盒模型分為2種：標準盒模型、怪異盒模型肤寝。
盒模型會在DOCTYPE聲明的時候默認標準盒模型当辐，而沒有DOCTYPE則會在ie6\7\8形成怪異盒模型。
標準盒模型的寬/高=width/height+padding+border
怪異盒模型的寬/高=width/height=內(nèi)容的寬/高+padding+border鲤看，怪異盒模型的內(nèi)容寬高會被padding和border占據(jù)缘揪。
(由于我理解的盒子寬高不包括margin，所以上面的計算中未加上margin)
那么义桂，如何轉換標準盒模型和怪異盒模型呢找筝？
通過設置box-sizing：content-box/border-box；
content-box是轉換標準盒模型慷吊，border-box是轉換怪異盒模型袖裕。
