1.Margin

???用來設(shè)置頁面中一個元素所占空間的邊緣到相鄰元素之間的距離.

?? 如果提供全部四個參數(shù)值，將按上－右－下－左的順序作用于四邊。
?? 如果只提供一個，將用于全部的四邊。
?? 如果提供兩個，第一個用于上－下，第二個用于左－右。
?? 如果提供三個，第一個用于上，第二個用于左－右，第三個用于下。

?? 在IE4+，margin屬性不可用于td和tr對象。

?? 用法:body { margin: 36pt 24pt 36pt; }

2.Padding

???用來設(shè)置元素內(nèi)容到元素邊界的距離。

?? 如果提供全部四個參數(shù)值，將按上－右－下－左的順序作用于四邊。
?? 如果只提供一個，將用于全部的四條邊。
?? 如果提供兩個，第一個用于上－下，第二個用于左－右。
?? 如果提供三個，第一個用于上，第二個用于左－右，第三個用于下。
?? 內(nèi)聯(lián)對象要使用該屬性，必須先設(shè)定對象的height或width屬性，或者設(shè)定position屬性為absolute。
?? 不允許負(fù)值。

?? 用法:body { padding: 36pt 24pt 36pt; }

?

在下面這個例子中，我們將了解如何為文檔本身（即body元素）定義外邊距。下圖顯示了我們對外邊距的要求。

滿足上述要求的CSS代碼如下：

body {margin-top:100px;margin-right:40px;margin-bottom:10px;margin-left:70px;}

或者你也可以采用一種較優(yōu)雅的縮寫形式：

body {margin: 100px 40px 10px 70px;}

幾乎所有元素都可以采用跟上面一樣的方法來設(shè)置外邊距。例如，我們可以為所有用<p>標(biāo)記的文本段落定義外邊距：

body {margin: 100px 40px 10px 70px;}p {margin: 5px 50px 5px 50px;}

為元素設(shè)置內(nèi)邊距

內(nèi)邊距（padding）也可以被理解成“填充物”。這樣理解是合理的，因?yàn)閮?nèi)邊距并不影響元素間的距離，它只定義元素的內(nèi)容與元素邊框之間的距離。

下面我們通過一個簡單的例子來說明內(nèi)邊距的用法。在這個例子中，所有標(biāo)題都具有背景色：

h1 {background: yellow;}h2 {background: orange;}

通過為標(biāo)題設(shè)置內(nèi)邊距，你可以控制在標(biāo)題文本周圍填充多少空白：

h1 {background: yellow;padding: 20px 20px 20px 80px;}h2 {background: orange;padding-left:120px;}

轉(zhuǎn)載于:https://www.cnblogs.com/nanyangzp/p/4827366.html

總結(jié)

以上是生活随笔為你收集整理的css中padding和magin的区别的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。