html - 图标样式与图标类的结果不同

Question

我正在尝试在我的网站中使用 Font-Awesome 图标。

我有以下 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>

这就是我想要的样子，这也是元素样式的样子:

这与我使用的结果不同:

<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>

在我的样式表中使用这个:

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

此处图标未正确对齐:

如果我将类设置为 icon-40 fa fa-hdd-o 而不是 fa fa-hdd-o icon-40，我会得到相同的结果(图标未对齐) 。

如何对齐这个图标？我想使用类而不是直接元素样式，因为我会有很多相似的图标，我不想对所有图标都使用元素样式。

Answer 1

我没有看到任何问题，它看起来像你的例子，内联 - 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>