div+css 盒子模型，寬高原來不是邊框的寬高

div+css 盒子模型

  • 之前一直沒有仔細(xì)去研究div+css盒子模型，今天閑來無事，看了下，發(fā)現(xiàn)之前的理解一直是錯的，因為之前一直是看并沒有實際動手去寫，或者寫出來也沒有深究。今天寫了一個簡單的盒子模型，然后瀏覽器里更改padding值，發(fā)現(xiàn)邊框在變大，然后就覺得有點奇怪，明明寬度和高度分別設(shè)置的200px，為什么寬和高還會變呢？
初始狀態(tài)

  • 調(diào)大padding值后，明顯看到邊框變大了

    調(diào)大padding后

  • 盒子模型=區(qū)塊+內(nèi)邊距+邊框+外邊距

    盒子模型

  • 寬和高限定的是區(qū)塊的寬和高，并不包括邊框。

紙上得來終覺淺，絕知此事要躬行

不實際試一下，還真沒注意這個事兒，后面還是好好看看css吧。
又看了下，上面這種情況是針對非IE瀏覽器的-。-||

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容