Question

我想在导航菜单和列表之间添加一个728x90像素的小横幅。我正在使用的当前代码是：

return

我正在使用中心标签将横幅放在中间。我只想在横幅的顶部添加一些空间，因为底部已有一些空间。我需要横幅才能做出回应。

Answer 1

非常尊重，请勿使用<center>标记。这就是将样式转移到HTML中，这不是优选/可取的。

此外 - 内联样式（<center style="margin-top: 10px;">）在可维护性方面可怕。除非绝对必要，否则请避免使用这些。

相反，使用CSS，结合提供有意义的类或ID的标记。

如何执行此操作的更有用的示例是：

HTML：

<div id="banner"><a href="https://imagesite.com/image.gif" /></a></div>

CSS（最好在样式表中）：

#banner {
    text-align: center;
    margin: 10px 0 10px 0; /* Top Right Bottom Left */
}

/* if the image must be responsive.... */
#banner img {
    width: 100%;
    height: auto;
}

<强>更新如果您希望将相同的样式应用于页面上的多个元素，那么您可以使用类来代替ID（它应该是唯一的 - 页面上只有一个元素应该具有给定的ID）： p>

HTML：

<div class="banner"><a href="https://imagesite.com/image.gif" /></a></div>

CSS（最好在样式表中）：

.banner {
    text-align: center;
    margin: 10px 0 10px 0; /* Top Right Bottom Left */
}

/* if the image must be responsive.... */
.banner img {
    width: 100%;
    height: auto;
}

Answer 2

使用边距或填充来增加元素周围的空间

<center style="margin-top:15px"><a href="https://imagesite.com/image.gif" /></a></center>

你可以用于每一方

margin-top
margin-right
margin-bottom
margin-left

或juste margin

Answer 3

您可以尝试在居中的项目顶部添加边距和/或填充

<center style="margin-top: 50px"><a href="https://imagesite.com/image.gif"/></center>

在标题横幅和导航菜单之间添加一个小空格

3 个答案: