顶部是边距还是顶部是边距？

Question

我混淆了padding-top，margin-top和top。我的问题是我想创建一个15px的空间。

margin-top: 15px可以，但是我认为这是错误的吗？

.subtitles{
  font-size:13px;
  font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  text-transform:  uppercase;
  text-align: center;
  margin-top: 15px;
}

下面是我的代码：

    header{
  background-color: #535353;
  width: 100%;
  height: 100px;
  top:  0;
  left: 0;
  display: block;
  position:  absolute;
}

.subtitles{
  font-size:13px;
  font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  text-transform:  uppercase;
  text-align: center;
  margin-top: 15px;
}

.subtiles-left{
  display: inline-block;
  padding-right: 10px; 
}

.subtiles-right{
  display: inline-block;
  padding-right:  18px;
  float: right;
}

    <header>
      <div class="subtitles">
        <div class="subtiles-left">Portofolio</div>
        <div class="subtiles-left">Languages</div>
        <div class="subtiles-right">Support</div>
        <div class="subtiles-right">Login</div>
      </div>
    </header>

Answer 1

这不是错误。您可以根据需要实现的余量或填充量。

我认为边距会影响边框后的空间，而填充会影响边框内的空间。

边距可用于放置父元素，因为它可以具有负值，而填充更多的是将元素放置在边框内并且不能具有负值。

Top通常用于相对于父元素放置元素，例如具有相对或绝对的样式位置。它也可以具有负值。

margin-top according to MDN web docs

padding-top according to MDN web docs

top according to MDN web docs