gpt4 book ai didi

css - 样式表中的 Font Awesome 5 图标显示为 unicode

转载 作者:行者123 更新时间:2023-11-28 11:23:53 25 4
gpt4 key购买 nike

我正在尝试像这样集成 FontAwesome:

.accordion:after {
content: "\f0d7";
color: #9E3E39;
font-weight: bold;
float: right;
font-size: 15px;
margin-left: 5px;
margin-top: -80px;
font-family: FontAwesome;
}

最终结果是这样的:

enter image description here

\f0d7

这是我们用于 FA 的脚本:

<script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>

这是在基于 invisionfree 的论坛中,使用 bbcode [dohtml] 激活 html 编码。

我做错了什么?我觉得理论上应该一切都好?

最佳答案

虽然 JavaScript 版本的 FontAwesome 支持伪类,但它们 not recommended :

enter image description here

因此,您应该使用 CSS 版本:

.accordion:after {
content: "\f0d7";
color: #9E3E39;
font-weight: bold;
float: right;
font-size: 15px;
/*margin-left: 5px;*/
/*margin-top: -80px;*/
font-family: FontAwesome;
}
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<div class="accordion">Accordion</div>

或者更好的是,利用 <i>标签(将其视为 svg 附加样式的目标):

.accordion svg {
color: #9E3E39;
font-weight: bold;
float: right;
font-size: 15px;
font-family: FontAwesome;
}
<script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
<div class="accordion">Accordion <i class="fas fa-caret-down"></i></div>

关于css - 样式表中的 Font Awesome 5 图标显示为 unicode,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49415785/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com