相关疑难解决方法(0)

<li>标签上的FontAwesome替换显示空方块

尝试使用Font Awesome图标替换列表项标签上的项目符号类型,但我得到一个空方块:

HTML

ul {
  list-style: none;
}

.testitems {
  line-height: 2em;
}

.testitems:before {
  font-family: "Font Awesome 5 Free";
  content: "\f058";
  margin: 0 5px 0 -15px;
  color: #004d00;
  display: inline-block;
}
Run Code Online (Sandbox Code Playgroud)

CSS

<script src="https://use.fontawesome.com/releases/v5.8.1/js/all.js"></script>
<ul>
  <li class="testitems">List Item 1</li>
  <li class="testitems">List Item 2</li>
  <li class="testitems">List Item 3</li>
  <li class="testitems">List Item 4</li>
  <li class="testitems">List Item 5</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

我知道字体库正在加载,因为我能够使用<i class="fas fa-check-circle"></i><li class="testitems">List Item 1</li>并正确呈现字体(虽然没有正确设置样式).

css font-awesome font-awesome-5

5
推荐指数
1
解决办法
2918
查看次数

标签 统计

css ×1

font-awesome ×1

font-awesome-5 ×1