段落中的行高問題

我正在使用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

段落中的行高問題

回答

相關問題