6

<html>我有一个应用程序，它要求我使用 CSS 将and<body>标记的高度设置为 100%，如下所示（ JSFiddle 版本）：

html, body {
  display: block;
  height: 100%;
  margin: 0px;
  padding: 0px;
  width: 100%;
}

body {
  background-color: #141414;
  overflow-x: hidden;
  overflow-y: auto;
}

我已经包含了为这些标签设置样式的所有 CSS。但是，我总是有一个滚动条，它可以让我向下滚动大约 20 像素，而不管页面内容的实际大小。这个问题也存在于任何尺寸的屏幕上。

我可以在这些屏幕截图中看到原因。请注意，body 的 ID 为#container，但这仅用于 JS 定位，而不是 CSS 样式：

在此处输入图像描述

同一页面的 3D 透视图，显示<body>标签从标签顶部向下滑动<html>：

在此处输入图像描述

由于我在这些标签上没有任何边距或填充，并且由于页面顶部附近的任何 HTML 元素都没有任何边距或填充来将<body>标签向下推，所以我真的被卡住了。

如何修复 CSS 以使<body>标签与页面顶部齐平？

感谢您的时间。

4

3 回答 3

3

尝试

header {
    margin: 0px 17% 0px 17%;
}
于 2012-08-18T17:48:32.500 回答
1

最可能的原因是利润率下降。padding: 0.01px你可以通过添加到你的身体来“解决”这个问题。

希望我第二次尝试回答这个问题不会像我第一次那样愚蠢 XD

于 2012-08-18T17:50:28.920 回答
-4

好像你有一个新行或和之间的<html>空格<body>......

试试这个：

<html><body>
    ...
</body></html>

代替：

<html>
<body>
    ...
</body>
</html>
于 2012-08-19T17:28:08.430 回答