段落中的行高问题

我正在使用WordPress并将一个类应用于一段文章。段落中的行高问题

这是帖子的文字

<p> 
    <span class="disclaimer">A really long line of text that covers more than one line.</span> 
</p>

这里是我的CSS

p > .disclaimer { 
    font-size: 50%; 
    line-height: 50%; 
}

这里是我的问题：
字体变小50％，但该行高度不会。无论我为线路高度输入什么值，它的尺寸都不正确。文字显示线条环绕时的巨大间距。

来源

2016-01-22 user1488639

见http://stackoverflow.com/questions/6071987/line-height-as-a-百分比不工作 –

你需要把line-height上p而非span：

p { 
 
    line-height: 50%; 
 
    width:100px; /* for example only*/ 
 
} 
 
.disclaimer { 
 
    font-size: 50%; 
 
}

<p><span class="disclaimer">A really long line of text that covers more than one line.</span></p>

来源

2016-01-22 10:14:23 Pete

也打我吧:) – Aaron

你也打我:)但只限于注意：这是一个很好的做法，使用'无单位线高度'[css-triks]（https://css-tricks.com/almanac/properties/ l/line-height /），[另一个链接]（http://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/）。所以你可以尝试使用'line-height：0.5'而不是'line-height：50％;' – pgk

@pgk，我也会使用0.5，但由于50％是在原始问题中，我不想改变太多 – Pete

尝试

p > .disclaimer { 
font-size: 50%; 
line-height: 50%; 
display:block;}

来源

2016-01-22 10:13:15 m0riarty

尽管这可以回答这个问题，但最好提供一些关于代码如何提供帮助的解释。 – vard

谢谢我欣赏快速响应。 – user1488639

line-height作品不同的在线元素比它为块元素。

尝试display: block;在跨度的CSS，或者如果你需要使用跨度内联元素，您可以参考here

来源

2016-01-22 10:17:46 gmanou

谢谢我欣赏快速反应。 – user1488639

段落中的行高问题

回答

相关问题