处理间距的最佳做法

Question

我知道这是一般性问题，但我想知道如何最好地处理带有部分的页面？

 //page

      //block a

      //block b

      //block c

为页面和每个块提供间距的最佳方法是什么？ 例如我所做的就是为各个区块提供保证金。

Answer 1

这个问题非常主观，但通常你想在底部和右边创造空间。如果要在元素之间放置空格，请使用边距，如果要在边框和容器中的内容之间放置空格，请使用填充。

支持底部和右边的原因是，如果你在块a上放置一个底部边距，它将总是在它下面有一个空格。如果您将边距放在块b的顶部，那么如果您重复使用块a或交换块b，您还必须在其他项目上添加上边距。

Answer 2

这一切都取决于你想要做什么。对于段落，我几乎总是这样做。这样我只需要在需要时生成边距，这样就不会影响我的其余样式。

p + p{
    margin: 1.5rem 0 0 0;
}

对于div和其他内容元素，我经常添加插入填充，因为每个div的颜色可能略有不同，我希望它们保持彼此相邻，而不是像你拥有的空白空间一样你使用了保证金。

.content-heading,
.content-about,
.content-footer{
    box-sizing: border-box; // css3
    padding: 0.75rem 0;
}

但这一切都取决于我想要达到的风格。我不会说最好的做法。