0

我试图将 h2 放在 h1 的正下方，但它似乎正在创造一个巨大的差距/空间。是否有某种方法可以避免这种情况，或者这是编码错误？谢谢你。

网站链接：http: //younani.com/armen/musicindex.html

HTML：

<!DOCTYPE html>
<html lang="en">
<head>

    <title>Armens website</title>
    <meta charset="utf-8">
</head>
<body>
<div class="clearfix" id="container">
<p><link rel="stylesheet" href="armen.css" /></p>
<h1><i>Four To The Floor</i></h1>
<h2>Artist Management &amp; Events</h2>
<p></p>
<h3>&ldquo;It&rsquo;s not where you take things from,<br />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; it&rsquo;s where you take them to.&rdquo; <br />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; - Jean-Luc Godard</h3>
<div id="footer">
<p>Armen Sarkisian &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<a href="mailto:fttfmusic@gmail.com">fttfmusic@gmail.com</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<a href="http://www.fttfmusic.com/">www.fttfmusic.com</a></p>
</div>
</div>
</body>
</html>

CSS：

h1 {color: #FFFFFF; font-family: ballparkweiner; font-size: 70px;
text-align: center; }

@font-face {
    font-family: 'ballparkweiner';
    src: url('ballw___.eot');
    src: url('ballw___.eot?#iefix') format('embedded-opentype'),
         url('ballw___.woff') format('woff'),
         url('ballw___.ttf') format('truetype'),
         url('ballw___.svg#ballparkweiner') format('svg');
    font-weight: normal;
    font-style: normal;

}

h2 {text-align: center; font-size: 40px; color: #FFFFFF; font-family: Cambria;}

body {background-color: #000000;}

h3 {text-align: center; color: #FFFFFF; }

#footer { font-weight: bold; text-align: center; font-family: Audimat;
    clear: both; width:48%;
        border-radius: 8px;
        background-color:black;
        text-align:center; margin-right:auto;
        margin-left:auto; color: #FFFFFF; }
4

4 回答 4

5

h*浏览器中的元素往往有一些 .. 相当大的默认顶部和底部边距。您可以将它们专门设置为一些较小的值，甚至为零：

h1, h2 {
    margin-top: 0;
    margin-bottom: 0;
}

您当然可以将这些规则应用于您的特定标题。

于 2013-04-09T04:32:11.053 回答
3

将此添加到您的CSS：

h1, h2 {
    margin: 0px;
}
于 2013-04-09T04:32:26.943 回答
2

它margin在h1和上h2。在你的 CSS 中调整它们，例如

h1, h2 {margin: 0;}
于 2013-04-09T04:32:16.213 回答
1

代码：- 你可以试试这个

<div id="container" class="clearfix">
<p><link href="armen.css" rel="stylesheet"></p>
<h1 style="margin-bottom: -18px; margin-top: 0px;"><i>Four To The Floor</i></h1>
<h2 style="margin-top: 0px; margin-bottom: 0px;">Artist Management &amp; Events</h2>
<p></p>
<h3>“It’s not where you take things from,<br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; it’s where you take them to.” <br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; - Jean-Luc Godard</h3>
<div id="footer">
<p>Armen Sarkisian &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<a href="mailto:fttfmusic@gmail.com">fttfmusic@gmail.com</a>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<a href="http://www.fttfmusic.com/">www.fttfmusic.com</a></p>
</div>
</div>

参考这个链接http://css-tricks.com/forums/discussion/3825/solved-h1-and-h2-tags-leaving-too-much-space/p1

于 2013-04-09T04:35:35.187 回答