由于我对感官超载很敏感，并且对太多的视觉细节感到困惑，因此我想将CSS功能的调色板简化为可管理的工具包，但不会过多地影响美学上的吸引力。鉴于此，我似乎无可救药地失去了我的HTML元素的 margin和padding 之间的平衡。
所以我打算完全停止使用保证金来支持填充。对我来说，不管是视觉/ HTML专家（我不是经验丰富的后端程序员），看起来可行，但是，我确信存在区别存在的原因。
通过这篇文章，我要求大师们解释使用的缺点，而不是同时使用边距和填充，以及是否可以通过仅使用其中一个来实现合理优雅的设计。如果有人可以submit examples说明可以用一个而不是另一个完成的事情，那也会很棒。
答案 0 :(得分：2)
不是在每个方面都没有。
边距和填充是两个完全不同的东西。填充将增加对象宽度或高度的整体大小，而边距则不会。
想象一下，你有一组左侧浮动的链接。只是在链接上使用填充将导致锚元素非常大，很可能不是你想要的。然而，使用一点填充物和一个边距来增加锚之间的空间会更合适。
使用保证金确保某些东西远离其他东西。
使用填充可确保某些内容远离其自身边缘。
如果你在一个页面上有一个盒子的布局，并且你想在每个盒子和边框之间有间距，单独使用填充是不够的，所以你也必须使用边距。
作为一般规则，在需要时使用每一个。我知道你对css中变得混乱的事情的意思，但有办法简化事情。对于一个简单的网站，我之前做过以下工作。
<强> CSS
.leftMargin {margin-left: 10px;}
.rightMargin {margin-right: 10px;}
.topMargin {margin-top: 10px;}
.bottomMargin {margin-bottom: 10px;}
.leftPadding {padding-left: 10px;}
.rightPadding {padding-right: 10px;}
.topPadding {padding-top: 10px;}
.bottomPadding {padding-bottom: 10px;}
然后，您可以轻松设置通用padding和margin规则，而无需太多麻烦。但是，你可能会再次认为这会产生无法管理的html标记。
这是你必须自己解决的问题。要考虑的事情仅使用margins会产生非常不良的影响！更多的是折叠边距Why does this CSS margin-top style not work?。
希望这会有所帮助。
答案 1 :(得分：1)
嗯，我会说你无法避免使用保证金，并且它们有不同的用途。
填充应该用于在元素边缘和内容之间创建空间，而边距应该用于分隔元素。
如果你从不使用边框，那么可以说你可以取消其中一个但是如果你有两个div相邻，都有边框但是你不想让它们接触，你打算如何分离它们？可以定位它们，但通常边距是最佳方式。
还要考虑总元素宽度是宽度+填充，而你可以认为边距大小在元素的“外部”，尽管在技术上仍然是它的一部分。
我有很多样式标记，并且同样使用填充和边距
答案 2 :(得分：1)
我可以做的最简单的例子是，this one显示两个概念之间的差异。
请注意margin是border（红色）与周围环境之间的空格，而padding是内容之间的空格（在示例中是文本）和border。
通常你需要同时使用它们。但是，在少数情况下，当您根本不需要使用边框时，只需设置其中一个就可以很好地管理。
答案 3 :(得分：0)
不，如果你想做复杂的设计，那就不行了
holy grail of web design使用边距和填充的组合
即使margin和padding有时可以做类似的事情，但每个的目的都不同。
margin指的是元素相对于其他元素所需的空间 padding指的是元素内容与其边框之间的空格当您同时使用时，可以实现具有边距和填充的功率。