圖標樣式有不同的結果比圖標類

我有以下HTML：

<a href="some-link"><center><h2><i class = "fa fa-hdd-o" style = "color:black;vertical-align:middle;font-size:40px"></i> Mining Rig Building Service</h2></center></a>

這是我希望它看起來，這也是它的外觀與元素造型：

Original Image with Element-Styling

這有不同結果比如果我使用：

<a href="some-link"><center><h2><i class = "fa fa-hdd-o icon-40" style = "color:black;"></i> Mining Rig Building Service</h2></center></a>

有了這個在我的styleshe等：

.icon-40 { 
    font-size: 40px; 
    vertical-align: middle; 
    }

圖標沒有對準正確位置：

New version with class-styling

我得到相同的結果（與錯位圖標），如果我的班級設置爲icon-40 fa fa-hdd-o，而不是fa fa-hdd-o icon-40。

如何對齊此圖標？我想用類而不是直接的元素樣式，因爲我會有很多類似的圖標，而且我不想爲所有元素使用元素樣式。

來源

2014-03-24 Rushy Panchal

像這樣的事情？ [DEMO]（http://jsfiddle.net/Ruddy/5C4rL/） – Ruddy

此外'

'元素已被棄用，不應再使用。 –

@粗暴的類型，除了圖標是字體的一部分，而不是圖像：/。另外，我希望能夠在不設置明確的左/右位置的情況下將其放在任何位置。 –

我看不出任何問題，它看起來像你的榜樣，在線 - http://jsfiddle.net/G29Tw/

<a href="some-link"><center><h2><i class = "fa fa-hdd-o" style = "color:black;vertical-align:middle;font-size:40px"></i> Mining Rig Building Service</h2></center></a>

來源

2014-03-24 15:43:57 Nick

嗯，這很奇怪。我實際上通過將'font-40'類重命名爲另一個名字來修復它。在我的樣式表的cPanel編輯器中，'icon'在'icon-40'中突出顯示，所以它可能是另一個與之衝突的類。 –

圖標樣式有不同的結果比圖標類

回答

相關問題