我如何从FontAwesome的图标样式的颜色,大小和阴影?

例如,FontAwesome的网站将显示一些白色图标和一些红色图标,但不会显示如何样式它们的CSS……


当前回答

text-shadow: 1px 1px 3px rgba(0,0,0,0.5);

其他回答

如果你同时使用Bootstrap,你可以使用:

<i class="fa fa-check-circle-o fa-5x text-success" ></i>

否则:

<i class="fa fa-check-circle-o fa-5x" style="color:green"></i>

在FontAwesome 4.0中,类更改为'fa-2x', 'fa-3x'。

当我试图直接从BootstrapCDN(最简单的方法)使用图标时,我也遇到了同样的问题。然后我下载了CSS文件,并将其复制到我网站的CSS文件夹CSS文件(在“简单方法”字体awesome文档中描述),一切都开始正常工作。

有一个非常简单的方法来改变字体Awesome图标的颜色。

<!-- Font Awesome insert code --> <script src="https://use.fontawesome.com/49b98aaeb5.js"></script> <!-- End --> <i class="fa fa-thumbs-up fa-5x" aria-hidden="true" style="color:#00cc6a"></i> <i class="fa fa-thumbs-up fa-4x" aria-hidden="true" style="color:#00cc6a"></i> <i class="fa fa-thumbs-up fa-3x" aria-hidden="true" style="color:#00cc6a"></i> <i class="fa fa-thumbs-up fa-2x" aria-hidden="true" style="color:#00cc6a"></i> <i class="fa fa-thumbs-up" aria-hidden="true" style="color:#00cc6a"></i>

您可以根据自己的喜好更改十六进制代码。 注意:文本颜色也会改变图标的颜色,除非在i标签中有style="color:#00cc6a"。

请参考链接 http://www.w3schools.com/icons/fontawesome_icons_intro.asp

<i class="fa fa-car"></i>
<i class="fa fa-car" style="font-size:48px;"></i>
<i class="fa fa-car" style="font-size:60px;color:red;"></i>

<i class="fa fa-car fa-lg"></i>
<i class="fa fa-car fa-2x"></i>
<i class="fa fa-car fa-3x"></i>
<i class="fa fa-car fa-4x"></i>
<i class="fa fa-car fa-5x"></i>