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

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


当前回答

如果你同时使用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>

其他回答

将i标签包装在p或span中,然后您可以使用bootstrap css类

<p class="text-success"><i class="fa fa-check"></i></p>

简单地说,你可以在css文件中定义一个类,并将其级联到html文件中

<i class="fa fa-plus fa-lg green"></i> 

现在用CSS写下来

.green{ color:green}

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

inyour.css文件:

    *.icon-white {color: white}
    *.icon-silver {color: silver}

inyour.html文件:

    <a><i class="icon-book icon-white"></i> Book</a>
    <a><i class="icon-ok-sign icon-silver"></i> OK</a>

尺寸:fa-lg, fa-2x, fa-3x, fa-4x, fa-5x For Color: <i class="fa fa-link fa-lg" aria-hidden="true"style=" Color: indianred"></i> . 对于阴影:.fa-linkedin-square{text-shadow: 3px 6px #272634;}