Question

我有一个<div>，其中包含<h1>标记（目前这是唯一的。我正在自上而下建立此网站）。我在标题上面有一个非常大的空间。使用firebug向下钻取时，<body>或<div>中不包含该空格，但是<h1>标记之上的边距。不应该整个标签，边距和所有，被父容器包围？有没有办法做到这一点？在空间完全无法移动的时刻，不属于任何容器。

例如：

<html style="background:green">
<head>
</head>
<body style="background:blue">
    <div style="background:red">
        <h1 style="background:yellow">Hello world!</h1>
    </div>
</body>
</html>

您可以清楚地看到，在显示时<body>和<div>都没有包围该边距。

Answer 1

您可以尝试此代码，因为h1具有默认边距

h1{margin:0;}

Answer 2

我发现了一个类似的问题here，并在链接后找到了这些网站的答案：

基本上，它与折叠边距有关。为了解决这个问题，我不得不在容器中添加1px填充。

Answer 3

如果您遇到边缘和填充的问题，您可能想尝试使用CSS Reset。

* { 
    margin: 0; 
    padding: 0;
}

上述重置通常适用于我。

Answer 4

使用 line-height: 0.65em; //倾向于减少或消除这种重叠边际问题。

<h1>标签</h1>上方的无主边距

4 个答案: