CSS、嵌套 div 和边距与填充

Question

我完全理解盒子模型。这个问题更多的是试图确定一种关于何时使用边距和何时使用填充的语义方法。

这是一个典型的例子，

首先，用简单的英语:

• 情况:我们有一个容器 div，其中有一个段落元素。

• 目标:在 div 内部和段落外部之间留出 12px 的空间。

• 选项 a) 对容器 div 应用 12px 的内边距

• 选项 b) 对段落元素应用 12px 的边距

或者，如果您愿意，HTML:

<div id="container">
    <p>Hello World!</p>
</div>

和 CSS:

选项a)

div#container {padding: 12px;}

选项 b)

p {margin: 12px;}

干杯!

乔恩

Answer 1

paddings 和 margins 效果一样，除了以下情况(我可能会漏掉一些):

1. 你有某种背景属性。边距不会得到它们。
2. 你有一个边框
3. 您使用 TD(无边距)
4. 两个嵌套元素，边距折叠在一起，而填充不是。
5. (需要检查这个)它们可能对元素的宽度和高度有不同的影响。 (如果有人知道得更多，请编辑此)。