我不经常编辑 CSS，几乎每次我都需要去谷歌搜索 CSS box model 以检查 padding 是否在 border 和 margin 之外，反之亦然。 （刚刚再次检查，padding 在里面）。
有没有人有一个很好的方法来记住这一点？有点助记符，很好地解释了为什么名字是这样的......
【问题讨论】：
标签： css padding margin mnemonics
当使用 CSS 最终让你发疯时，他们将把你放入的填充单元在墙壁的 inside 上有填充。
【讨论】：
pin - P 在里面
【讨论】：
您正在使用一个盒子。如果你把东西放在盒子里，你会在里面放一些填充物，以确保它不会撞到侧面。保证金将是另一回事。
【讨论】：
从规范的Box Dimensions 部分打印图表，并将其贴在墙上。
【讨论】：
对我来说，“填充”听起来比“边距”更内在。也许考虑打印页面会有所帮助？边距是最外面的区域——通常，你甚至不能打印到边缘——它们是无标记的。在这些边距内，可以填充内容以在内容和边距之间提供额外的屏障？
一旦你足够多地使用 CSS，记住这一点将成为第二天性。
【讨论】：
随着时间的推移我刚刚学会了它 - 盒子模型相当简单，但人们觉得它很难的主要原因是因为 body 并没有明显破坏模型。
真的，如果你给body 一个边距和一个背景，你应该会看到它被一条白条包围。然而事实并非如此——body 的填充与边距相同。这确立了关于盒子模型的一些不正确的事情。
我通常是这样想的：
【讨论】：
内部通常使用填充。无论是在墙壁内部还是在送货箱上，都很简单。如果填充在里面，那么边距在外面。应该不会太难。
【讨论】：
用萤火虫帮你看。
【讨论】：
Tim Saunders 给出了一些极好的建议——当我第一次开始使用 CSS 时，我特别注意构建一个好的、完全注释的基本样式表。该样式表已经更改了很多次，并且仍然是一个了不起的资源。
但是，当我遇到自己的盒子模型问题时，我开始使用“Mo Pi”。比如，“我还不够胖，我要吃mo pi。”奇怪，但它对我有用。当然，我在学习 CSS 时长了 20 磅……;-)
【讨论】：
为自己创建一个带注释的基本样式表，您可以在需要创建新站点或编辑现有站点时将其用作模板。
随着知识的增长，您可以添加它并将其应用于各种不同的浏览器，以查看各种事物的行为方式。
您还可以添加有关其他难以记住的内容或违反直觉的内容的 cmets 或示例。
【讨论】：
添加边框，即使只是暂时的。当您玩弄这些数字时，您会发现其中的不同。
事实上，元素周围的临时边框是一种有用的工作方式，这样您就可以看到浮动下降的原因等等。
【讨论】：
我知道这是对您问题的回答，但更多的是提示。每当我处理边距和填充时，我都会在你正在使用的部分周围添加一个边框，然后从那里，它会告诉我我必须使用的房间。一切就绪后，我移除边框。
【讨论】：
PAdding 是元素 PAinting 的一部分：它扩展了元素的 背景。将一对元素+填充视为共享一个共同的背景是有意义的。填充类似于绘画的画布：填充越大，画布越大，因此背景越大。边框（这幅画的框架）将围绕那一对。 margin 将画廊墙上的画作分开。考虑对象背景的概念有助于将对象+填充对粘合在一起。内部与外部的通常解释并不能牢记：一段时间后，每个人都会回到最初的混乱状态。还要记住，边距是垂直可折叠的，而填充则不是。
【讨论】：
边距：当你想移动块时。 填充：当你想在一个块内移动项目时。
【讨论】：