【问题标题】:Body top gap; should I use margin or padding?体顶间隙;我应该使用边距还是填充?
【发布时间】:2015-09-08 04:32:45
【问题描述】:

所以,我正在开发一个带有固定标题(用于导航)的网站。
我在 body 上使用 padding-top 来降低内容以适应标题。

这就是现在的样子:

body
{
    background-color: red; 
    padding-top: 50px;
}
.header {
    background-color: yellow;
    position: fixed;
    width: 100%;
    height: 50px;
    top: 0;
    left: 0;
}
<div class="header">
    Header
</div>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.<br>
Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

我的问题是:在这种情况下使用什么更好? margin-top 还是 padding-top?

【问题讨论】:

  • paddingmargin 没有比这更好的了。每个都有不同的目的,尽管在这种特殊情况下,结果在视觉上是相同的。
  • 因为它是你应该使用填充的主体。但这只是我的看法

标签: html css margin padding


【解决方案1】:

实际上没有更好的方法可以做到这一点。这只是给你。也许一个渲染速度会比另一个快一些,但没有人能注意到。

无论如何,提示是使标题定位为固定,以便它与用户一起向下滚动。

【讨论】:

  • 这就是我所做的“位置:固定;”。还是你在说别的?
  • 是的,就是这样,我错过了。
猜你喜欢
  • 2011-08-20
  • 1970-01-01
  • 1970-01-01
  • 2011-11-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-12-05
相关资源
最近更新 更多