具有兩種不同字體大小的句子的行位置

我在一個句子中使用兩種不同的字體大小（13px和30px）。我的問題是如何將文本置於正常位置，就好像它全部是字體大小13一樣？目前它低於通常的位置。具有兩種不同字體大小的句子的行位置

<div class="aa"> Click <span>-</span> sign</div> 

.aa {font-size:13px;} 
span {font-size:30px; position: relative; top: 3px;}

編輯： enter image description here

2015-05-11 Becky

從你撥弄它似乎好。這是'點擊 - 符號'正確對齊。有什麼問題？ – Vlad

你可以給一個屏幕快照或小提琴。 –

@Vlad：在我的小提琴中，取消註釋'<！ -

Click sign

- >'查看句子位置的差異。 – Becky

試試這個Fiddle。

CSS代碼：

.aa {font-size:13px;} 
span {font-size:30px; position: relative; top: 3px;line-height: 10px;}

2015-05-11 12:25:58 ArinCool

'top ：3px; line-height：3px;'works。謝謝。 – Becky

試試這個。

span {position: relative; top: -1px;}

2015-05-11 11:24:50 Vicky

你只是改變字體大小爲13？ – Becky

** top：-1px **值已更改。 – Vicky

您已更改'span {font-size：13px;位置：相對;頂部：-1px;}'？ – Becky

的問題是「 - 」（連字符）：你在CSS與top發揮，使其工作
看到這個Fiddle，它與一個字符串作品，未經連字符

2015-05-11 11:41:04 tektiv

@Beki。該解決方案看起來不錯說啥？ –

是的，它看起來不錯，用「正常」的字符串，但是當你把一個連字符（我找到了單詞：p）它不再工作了，因爲我認爲連字符不在行高的中間 – tektiv

正確的CSS proporty你會使用這個沃爾德是：

line-height:30px;

，如果有是div裏面的跨度，將其設置爲：

vertical-align:top;

2015-05-11 12:24:21 MoLow

回答