html - 如何更改 fa-border 中的文本字体？

Question

我有一个完全使用 HTML5 和 CSS3 制作的模型网站模板，位于 here .

然后我开始使用 Font Awesome 5，使用 CSS webfont 选项(与带有 JS 版本的 SVG 相对)。

我使用 <span class="fas fa-hashtag fa-border" aria-hidden> Lorem ipsum dolor sit amet,</span> 找到了一个巧妙的技巧而不是使用 <span>和 <h1>标签。

这样呈现，here .

如何更改默认字体？

附言span {font-family: “Font”, sans-serif;}不起作用。

附言.fa-border {font-family: “Font”, sans-serif;}也不起作用。

Answer 1

这是因为你使用了.fas您的跨度中的类具有字体系列 Font Awesome .

所以我建议将您的图标包装在 <i> 中标记，然后将字体应用于 <span> .边境申请 fa-border类别为 <span>

堆栈片段

span {
  font-family: Verdana;
}

<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
<span class="fa-border"><i class="fas fa-hashtag"></i>Lorem ipsum dolor sit amet,</span>