用法簡介
box-sizing屬性主要的取值有content-box，border-box和inherit,今天主要對前兩者進行區別
image.png
一般瀏覽器默認設置為content-box，就是我們平常使用的符合w3c標準的盒模型，設置的寬高僅僅是內容的寬高，整個div的寬度（BoxWidth）可以總結： BoxWidth = width+padding+border，當我們想設置一個固定寬高的盒子，就必須算出內容所占的寬度和高度，使用width和height設置即可，可見使用content-box很麻煩。
但border-box就有所不同了，它給我們帶來了便利，當我們設置后，我們就不必進行計算，要想設置多大的盒子，我們直接使用width和height設置即可，最后內容的大小瀏覽器會自動呈現。width = contentWidth+padding+border。
瀏覽器支持情況
image.png
現階段大多數瀏覽器都支持box-sizing屬性，但有些瀏覽器還是需要加上自己的前綴，Mozilla需要加上-moz-，Webkit內核需要加上-webkit-，Presto內核-o-,IE8-ms-。
到此box-sizing屬性就介紹完畢了
