html - 当我从浏览器缩小时，我的网站布局完全移动到浏览器屏幕的左上角？

Question

当我从浏览器缩小时，我的网站布局完全移动到浏览器屏幕的左上角？

当我检查一些网站时，比如 yahoo.com 并从浏览器中缩小。它停留在中心。

Answer 1

我知道这个问题有点老了，但也许它可以帮助其他人。

布局贴在左边

我猜你的布局粘在左边，因为它没有居中。如果要使布局的元素居中，则必须使用以下 css 代码：

.my_element{
  margin: 0 auto;
}

这意味着“顶部和底部的像素为 0，左右的像素数量相同”（水平居中）。

但要小心，如果元素没有宽度，则不能使用此“技巧”：

.my_element{
  margin: 0 auto;
  width: 300px;
}

这是关于 jsfiddle的演示。在这个例子中，每个元素都是水平居中的。

但我们可以做得更好。在第二个演示中，我们添加了一个包含每个元素的包装器，我们只需将其居中即可。

布局坚持顶部

如果你不希望你的布局粘在顶部，你只需要在第一个 div 上设置一个margin-top ，这是我们示例中的包装器：

.wrapper{
  margin-top: 20px;
}

请注意，英语不是我的母语，如果您发现一些错误，请告诉我。