Question

当我在div上使用100％宽度时，它会在div的顶部和两侧留下空间。

<!DOCTYPE html>
<html>
<!--Head-->
<head>
    <title>Music</title>
</head>
<!--Body-->
<body>
    <div style = "background-color: #0FCCB3; height: 10em; width: 100%;"> </div>
</body>
</html>

变成：

Screenshot

看到顶部和侧面的白色空间？我该如何摆脱它？

Answer 1

这是因为BODY元素有边距。

添加以下样式：

<style>
body { margin: 0px; }
</style>

Answer 2

在body元素上的那个边距（或填充），只需删除它

body{
    margin:0;
    padding:0;
}

http://jsfiddle.net/Th53K/

Answer 3

这来自body标签的填充或边距值。删除它们：

body{
  margin:0;
  padding:0;
}

浏览器会应用一些默认样式，这些样式对于不同的浏览器和版本可能会有所不同。为避免浏览器默认设置出现意外，您可以使用css reset

Answer 4

您需要重置浏览器默认样式。在这种情况下，您可以

html, body {
    margin: 0;
    padding: 0;
}

但我建议在启动项目时使用normalize.css http://necolas.github.io/normalize.css/来获得一个清晰的平板。

Div宽度100％不占用100％的页面？

4 个答案: