怎么调整font awesome图标大小?

发布于 2022-09-04 01:19:27 字数 52 浏览 19 评论 0

怎么调整font awesome图标大小?
默认是最小的那个,要用大一点的怎么办呢?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(8

烧了回忆取暖 2022-09-11 01:19:27

它是一种“图标字体”,所以按照一般字体大小的设置方式来设置,也就是font-size

老街孤人 2022-09-11 01:19:27

我们要从原理上来了解 font awesome 字体的大小来如何控制。font awesome 使用了伪类 before 来设置图标,

clipboard.png

clipboard.png

font awesome 是一种字体,控制图标的大小,是通过 font-size 来实现的,before 字体大小 font-size 继承父亲,

clipboard.png

找到对应的元素,修改 font-size 就可以实现控制图标大小了,

clipboard.png

红ご颜醉 2022-09-11 01:19:27

fa-2x fa-3x fa-4x fa-5x

还不够的话就自己设置font-size

遗弃M 2022-09-11 01:19:27

可参考fontawesome官网的example ,里面不止有讲到如何调整字体大小还有如何固定宽度以及在特定部位使用图标的tips甚至还可以自己对图标进行旋转等等。
图标大小控制:
直接在对应的图标类名后添加:fa-lg (比默认大小大33%), fa-2x, fa-3x, fa-4x, fa-5x中的任一类名。或者你直接用css的font-size轻松控制喔。

青柠芒果 2022-09-11 01:19:27

图标字体,按照css控制字体样式规则,直接使用font-size即可

自此以后,行同陌路 2022-09-11 01:19:27

可以直接用css样式控制

能怎样 2022-09-11 01:19:27

font-size

葬心 2022-09-11 01:19:27
<i class="fa fa-pause-circle-o fa-2x" aria-hidden="true" style="color:white"></i>其中的fa-2x中的数值就是调整大小,希望可以帮到你
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文