2

我的印象是写： 

  margin-bottom: 5px;

将与

  margin: 0px 0px 5px 0px;

然而，两者的行为不同。第二个不仅在底部添加边距，而且还会导致一些边距出现在侧面。我正在使用 Bootstrap 脚手架，它会导致内容换行。

看着 Firebug，我看到： 

    margin: 0 0 5px;

你能解释一下这里发生了什么吗？

4

3 回答 3

3

margin有四种速记形式：

  • margin: X扩展为X X X X
  • margin: X Y扩展为X Y X Y（顶部和底部的 X，侧面的 Y）
  • margin: X Y Z扩展为X Y Z Y（X 在顶部，Y 在侧面，Z 在底部）
  • margin: X Y Z T明确定义所有四个边距。

在您的情况下，您定义了X Y Z T，但Y和T是相同的，因此浏览器将其简化为同义词X Y Z。

它不应该在边上添加边距，但要注意的一点是，您明确地将其他边距设置为零 - 这可能会导致问题。

于 2013-10-01T08:57:58.080 回答
1

您显示的两种样式声明是不同的：

第一个margin-bottom: 5px;，仅指定下边距，因此对于其他地方定义的所有其他边距（上，左，右）值（如果不在您的样式表中，那么可能在浏览器的默认样式表中）仍然适用 - 而第二个，margin: 0px 0px 5px 0px;显式设置所有值。

于 2013-10-01T10:03:05.410 回答
0

希望这可以帮助：

边距：0 0 5px；是[上]、[左和右]、[下]。

于 2013-10-01T09:04:21.957 回答