我如何从FontAwesome的图标样式的颜色,大小和阴影?
例如,FontAwesome的网站将显示一些白色图标和一些红色图标,但不会显示如何样式它们的CSS……
我如何从FontAwesome的图标样式的颜色,大小和阴影?
例如,FontAwesome的网站将显示一些白色图标和一些红色图标,但不会显示如何样式它们的CSS……
当前回答
试着简单地使用像fa-lg,fa-2x,fa-3x,fa-4x,fa-5x之类的东西来增加相对于容器的图标大小
例如:-
其他回答
看起来像FontAwesome图标颜色响应文本信息,文本错误等。
<div style="font-size: 44px;">
<i class="icon-umbrella icon-large text-error"></i>
</div>
text-shadow: 1px 1px 3px rgba(0,0,0,0.5);
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>
只需目标字体-很棒的预定义类名
例:
HTML
<i class="fa fa-facebook"></i>
CSS
i.fa {
color: red;
font-size: 30px;
}
我不建议你使用fa-5x之类的内置字体样式;因为担心他们可能会改变它,你将不得不继续链接你的应用程序代码,以满足最新的标准。你可以通过给每个你想要统一样式的font-awesome类指定相同的类来避免这种情况:
<i class="fa fa-facebook-square fa-sabi-social-icons" aria-hidden="true"></i>
<i class="fa fa-twitter-square fa-sabi-social-icons" aria-hidden="true"></i>
<i class="fa fa-google-plus-square fa-sabi-social-icons" aria-hidden="true"></i>
这里的类是fa-sabi-social-icons
然后在你的css中,你可以使用与普通字体样式相同的css规则来设置字体的样式。 如
.fa-sabi-social-icons {
color: //your color;
font-size: // your font-size in px, em or %;
text-shadow: 2px 2px #FF0000;
}
这将使您的字体非常棒的字体样式