font-awesome - 在 css 中更改字体很棒的大小。你怎么做呢?

标签 font-awesome

我尝试使用 font-size 更改字体很棒的大小,但由于此 css 无法正常工作:

font-size: inherit

有没有办法覆盖这个?我试图在移动设备或屏幕时将 font-awesome 设置为两种不同的大小,并且我想使用 css 而不是不同大小的 font-awesome 标签来影响字体大小。我能做什么?

最佳答案

通常字体很棒的图标会获得它们在其中使用的元素的大小(即继承)。例如:

HTML

<p><i class='fa fa-pencil'></i> Some text here.</p>

CSS
p{
   font-size: 16px;
}

在这种情况下,您的图标的大小为 16 像素。
但是,您可以单独调整图标大小。首先,请确保您的 css 文件位于 <head> 中的 font-awesome.css 之后。阻止它处于优先级或使用 !important。

1) 您可以在自己的 css 文件中从 font-awesome.css 重写 'fa' 类样式:
.fa{
    font-size: 3em !important; /*size whatever you like*/
}

2)或者给图标一些其他的类并设置它的样式:
.newclass-for-i{
    font-size: 3em;
}

要为移动设备和屏幕设置不同的样式,请使用 css 媒体查询:
@media (max-width:desired width){
    your styles
}

关于font-awesome - 在 css 中更改字体很棒的大小。你怎么做呢?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32426519/

相关文章:

css - 悬停效果不适用于堆叠 Font Awesome 图标

css - 带有 css 的 Font Awesome 图标上的多色

html - 如何使用 CSS 增加 unicode 图标相对于其容器的 Font Awesome 的大小

c# - 如何更改 Xamarin 导航标题中所有工具栏项目的字体

css - Font Awesome - 更改类 "i"中的内部 ="fa-info-circle"颜色

css - 如何制作加载图标

ios - FontAwesomeKit - 'NSInvalidArgumentException' iOS 7.1.1

ruby-on-rails - Font Awesome 图标在 Heroku 上显示为黑色方 block

css - 我想将选择图标/下拉图标更改为 (fa-chevron-down)。我怎样才能?

html - Chrome 问题 : Font awesome in ul li a breaks padding