為什麼 Font Awesome 5 SVG 列表項目項目符號顯示為空方塊？

使用JS SVG 版本時，Font Awesome 5 顯示空方塊

當嘗試將Font Awesome 5 與JS SVG 版本一起使用時，使用者可能會遇到列表項目項目符號呈現為空方塊的問題。此問題是由於 Font Awesome 5 預設禁用偽元素支援而產生的。

解決方案

為JS 版本的Font Awesome 啟用偽元素支援5、在腳本中加入data-search-pseudo-elements屬性標籤：

<script data-search-pseudo-elements src="https://use.fontawesome.com/releases/v5.13.0/js/all.js"></script>

此外，在偽元素中設定SVG元素的樣式至關重要：

.testitems:before {
  content: "\f058";
  display: none;
}

.testitems svg {
  color: blue;
  margin: 0 5px 0 -15px;
}

透過執行以下步驟，使用者可以將 Font Awesome 5 與偽元素無縫整合JavaScript 應用程式中的元素。

以上是為什麼 Font Awesome 5 SVG 列表項目項目符號顯示為空方塊？的詳細內容。更多資訊請關注PHP中文網其他相關文章！