margin 和 padding 的差別

通俗的講法：

padding：内邊距，如果以border為界限的話，在border裡。

margin：外邊距,在border外。

相同點：參數相同 （a,b,c,d）->(上,右,下,左)

舉個例子，很容易看出：

css樣式：

<code>div{</code>

<code>    </code><code>width</code><code>:</code><code>100px</code><code>;</code>

<code>    </code><code>height</code><code>:</code><code>100px</code><code>;</code>

<code>    </code><code>border</code><code>:</code><code>2px</code> <code>solid</code> <code>blue</code><code>;</code>

<code>    </code><code>padding</code><code>:</code><code>10px</code> <code>10px</code> <code>10px</code> <code>10px</code><code>;</code>

<code>    </code><code>margin</code><code>:</code><code>10px</code> <code>10px</code> <code>10px</code> <code>10px</code><code>;</code>

<code>    </code><code>background-color</code><code>:</code><code>black</code><code>;</code>

<code>}</code>

body部分很簡單，就隻有一個空的&lt;div&gt;&lt;/div&gt;.

本文轉自 愛笑嘚蛋蛋 51CTO部落格，原文連結：http://blog.51cto.com/dd118/1672953，如需轉載請自行聯系原作者