其实不然,对于test所占的位置的真正计算应该是width=margin-left + margin-right + padding-left + padding-right + width,也就是宽度真正所占的大小应该是内边距+外边距+宽度本身,也就是说test真正的大小应该是140px才对。高度的计算与宽度的计算是一样的。
而如果给test加上边框的话,这个宽度与高度的算法还应该加上边框的大小。
(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)#test{margin:10px;padding:10px;border:5px;width:100px;height:100px;}
这里的test的宽度就应该是外边框+内边框+边框+宽度本身,所以test的width是 150px。
如下图所示,width与height真正所占的位置并不是它本身的那一小块,而应该是一直到最外面深蓝色的那个层为止。