Question

嘿，我偶然发现了一些看起来很简单，几乎平庸的东西，但我不能只是把头包住。

所以我有一个网站并应用了一些级联样式表。

这是我在网站上讨论的元素。

非常简单，但由于某种原因，我似乎无法使用保证金，也没有填充来影响第一行文本（#FFF白色文本）。或者更具体地说，保证金有效，而不是保证金最高（也不是负底）。

HTML看起来像这样

<html>
...
<body>
 <div id = "header">
  <a href="#">I can't margin-top this</a>
  <h1>However it works on this</h1>
</div>
....
</body>

这样的样式表。

现在，正如您所看到的，第一个<a>应该在20px的边缘上，但是由于一些奇怪的原因，它似乎不受边距（以及填充）的影响。以下<h1>正在运作。

知道可能导致这种情况的原因吗？

最后但并非最不重要的是，这里检查<a>元素

可能有一个简单的解决方案，但我没有练习，我无法弄清楚这里的问题是什么。

Answer 1

inline元素无法获取大小或垂直margin / padding，将display:inline-block提供给<a>，它将接受margin-top < / p>

#header a {
display:inline-block;
/* + here your css rules */
}