React 用图标替换 li 项目符号

Question

我找到了许多用 CSS 或 font awesome 解决这个问题的答案，但是，我有一个来自 https://react-icons.github.io/react-icons/icons?name=bi 的图标，我想用其中一个图标替换 li 标记项目符号。

我尝试在每个

前面添加 但这看起来不太好，并且需要大量样式，因此想知道是否有更简单的解决方案。

Answer 1

在你的 ul 中创建一个类，然后为你的 CSS 设置样式，如下所示：

HTML：

<ul class="sample">
<li>This is a list item</li>
<li>This is another list item</li>
<li>This is also another list item</li>
</ul>

CSS：

ul.sample {
list-style-image: url('**your icon path **  icon_sample.jpg');
}