Question

我正在创建一个网页（第一次），我正在尽可能多地遵循CSS规则和标签。但是，我遇到了空白问题。我已经强调了第一行文字，但现在第二行似乎已经在下面漂移了。有没有办法让它更舒服一点，我希望第二行文字就在上面一行之下。

body,td,th {
    color: #000000;
}

body { 
 margin: 0; 
 padding: 0; 
 padding-top: 6px;
 text-align: center;
 background-color: #FFFFFF; 
} 
#centered
{ 
 width: 800px; /* set to desired width in px or percent */
 text-align: left; /* optionally you could use "justified" */
 border: 0px; /* Changing this value will add lines around the centered area */
 padding: 0;  
 margin: 0 auto; 
} 
.style3 {
    font-size: 32pt;
    color: #666666;
    margin-left: 0px;   
    border-bottom: 3px double;
}
.style5 {
    margin-left: 390px;
    font-size: 32pt;
    color: #CCCCCC;

}
-->

</style></head>

<div id="centered">


<body>
<p class="style3">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;FIRST LINE OF TEXT</p>
<p class="style5">INDENTED SECOND LINE</p>
</body>
</div>
</body>
</html>

Answer 1

p.style3, p.style5 {
    margin-top: 2px;
    margin-bottom: 2px;
}

使用这两个值，直到您对结果感到满意为止：）

Answer 2

您需要调整line-height。更具体地说，添加以下声明：

.style5 {
    line-height: 0.72em;
}

如果您只希望第一行.style5舒适，则需要调整上边距。请改用此声明：

.style5 {
    margin-top: -10px;
}

请参阅fiddle。

注意：您应该始终使用W3C Markup Validation Service和您的css使用W3C CSS Validation Service验证您的标记。当你刚开始时它会对你有所帮助。

Answer 3

您是否尝试过CSS行高规则？
http://www.w3schools.com/css/pr_dim_line-height.asp

Answer 4

HMM。你的代码小马车。首先我看到你有body OUTSIDE 。

尝试验证您的代码。

无论如何，您可以使用以下代码更改同一段落中的空间线：p {line-height:0.7em}这会创建字体大小的7/10行高。

如果你想减少paragrapsh之间的空间，你可以改变段落的边距填充。 p{margin:0 91px 0 37px;padding:0 43px 0 19px}

减少文本行之间的空白区域

4 个答案: