Question

以下HTML显示正常。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Hello</title>
    </head>
    <body>
        <div style="width: 100px; height: 100px; background: red;">
            <div>Hello</div>
        </div>
    </body>
</html>

但是，我的div和浏览器窗口的左边和上边之间有大约10个像素的空间。有没有办法摆脱它，以便div＃34;粘合＆＃34;到浏览器窗口？

Answer 1

您可以将CSS添加到文档....

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Hello</title>
    <style type="text/css">
    body { margin:0; }
    </style>
</head>
<body>
    <div style="width: 100px; height: 100px; background: red;">
        <div>Hello</div>
    </div>
</body>

或者您可以将CSS添加为内联样式

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Hello</title>
</head>
<body style="margin:0;">
    <div style="width: 100px; height: 100px; background: red;">
        <div>Hello</div>
    </div>
</body>
</html>

所有浏览器在窗口的左上角和左边缘都有默认边距。您的网页没有任何问题。您只需要告诉浏览器删除默认边距。

Answer 2

要单独留下其他元素的填充和边距，只需重置正文。

body { padding: 0; margin: 0; }

Answer 3

尝试在body标记中添加样式，如下所示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Hello</title>
    </head>
    <body style="margin: 0;">
        <div style="width: 100px; height: 100px; background: red;">
            <div>Hello</div>
        </div>
    </body>
</html>

Answer 4

使用CSS重置。

<style type="text/css">* { padding: 0; margin: 0; }</style>

Answer 5

如果您执行上述任何代码，但未将表格属性设置为百分比而非像素，则可能最终会在页面周围留下边距类型空间。就像在底部滚动条仍然会显示。

<table bgcolor="#FFFFFF" width="100%" cellspacing="0" cellpadding="4">
<tr>
<td width="15%" align="left" valign="top" bgcolor="#B8B8B6">
</td>
<td width="85%" bgcolor="#FFFFFF" align="left" valign="top">
</td>
</table>

如何摆脱HTML内容的边距？

5 个答案: