以HTML格式调整标签元素的行高

我有一个包装<label>元素的表单，但<label>的两行之间的空格太大，我似乎无法调整行的高度<label>。以HTML格式调整标签元素的行高

这里是一个<label>和<p>，都与施加相同的CSS的示例。正如你所看到的，<p>调整正确，而<label>保持不变。

CODE：

form label, 
 
form p 
 
{  
 
    font-weight:bold; 
 
    line-height:.7em; 
 
}

<form style="width:200px;"> 
 
    <fieldset> 
 
     <label for="textarea">In ten or fewer words, explain American history</label> 
 
     <p>In ten or fewer words, explain American history</p> 
 
     <textarea name="textarea" rows="5" ></textarea> 
 
    </fieldset> 
 
</form>

来源

2011-06-05 Yarin

所有的HTML标签，将工作被分类的类别描述其性质。这种分类可能与语义，行为，交互和许多其他方面有关。

两个p和label标签归类于“流动内容”标签类别。但是，之间有一个细微的差别：label标签也被归类为“短语内容”类别。

什么这一切意味着在实践中？浏览器默认呈现将遵循指定的标记分类，并会将该p标签作为一个块元件，而label标签将默认，可以称为在线元件处理。您可以通过覆盖默认的CSS规则来修改此内容：只需告诉浏览器您希望label呈现为块元素。

label { 
    display: block; 
}

你必须这样做，因为这是内联元素（显示：内联）不能有像height性质，line-height，margin-top，margin-bottom（它们将被忽略）。

如果你想要一个内联元素的高度属性，但仍保持它与它的在线行为（无故换行），你可以声明为：

label{ 
display:inline-block; 
}

它总是好的采取阅读HTML的文档。它可以为您节省大量的时间，特别是在处理这些小怪癖时。

来源

2011-06-05 22:49:26 marcio

布局方式 - 显示：block;确实是问题 - 谢谢 – Yarin 2011-06-05 23:54:39

不完全知道为什么，但如果你在标签上设置display: block;

来源

2011-06-05 21:57:16 Fredrik

我认为什么是马尔西奥想说的是，在inline元素（如span S或label S），可陆续在文本驻留一个，你不能指定适用于整个段落属性。

显而易见的是text-align：段落应指定对齐而不是个别span s。如line-height等。

的相对的inline元素是block元件等div或p占据一个页面上的正方形，并在较高的块级彼此之间布置。此行为由CSS属性display控制，使用div的行为就像span，反之亦然。

来源

2011-06-05 22:59:12 Gman

以HTML格式调整标签元素的行高

回答

相关问题