HTML中margin和padding的區別

標籤：技術分享   技術   img   ges   顯示   之間   外邊距   分享   http   

我們以DIV為一個盒子例子，既然和顯示生活中的盒子一樣，那我們想一下，生活中的盒子

內部是不是空的好用來存放東西，而裡面存放東西的地區我們給他起個名字叫“content(內

容)”，而盒子的紙壁給他起個名字叫“border（邊框）”，如果盒子內部的東西比如是一塊硬

盤，但是硬碟怕震動，所以我們需要在硬碟的四周盒子的內部均勻填充一些防震材料，這時

硬碟和盒子的邊框就有了一定的距離了，我們稱這部分距離叫“padding（內邊距）”，如果

我們需要購買許多塊硬碟，還是因為硬碟怕震動所以需要在盒子和盒子之間也需要一些防震

材料來填充，那麼盒子和盒子之間的距離我們稱之為“margin（外邊距）”

好滴！盒子模型的四要素就出來了，分別是：content（內容）、border（邊框）、

padding（內邊距）、margin（外邊距），如

我們的頁面就是由許許多多的盒子組成的~~~，但是和現實生活中的盒子不同，現實生活中

我們會忽略外邊距（margin），但是在頁面中，我們是不能忽略外邊距（margin）的，只有

包括外邊距的盒子模型在CSS中才是完整的，幾時外邊距為零，我們也不要忽略它，要知道他

是存在的

內容來自豆瓣的帆

 

HTML中margin和padding的區別