如何在选择选项标签中显示图标

Question

需要在选择选项标签中显示 Font Awesome？

如果我在外面使用它的工作<i class="fas fa-chart-pie"></i> 但是如果文本，我怎么能在标签中显示它

<select id="select_graphtype">
  <option value="line_graph"> Line Graph</option>
  <option value="pie_chart"> Pie Chart</option>
</select>

你能帮我一下吗？

Answer 1

您不能在（选项标签）内使用（图标标签），但您可以以不同的方式进行操作，例如在选择中使用 class='fa' 并在选项值中使用图标类。它在我的情况下完全有效。

<select id="select_graphtype" class="fa">
    <option value="fa fa-address-card"> &#xf2bb; line chart</option>
    <option value="fa fa-address-card"> &#xf2bb; Pie Chart</option>
</select>

如果这不起作用，请确保这一点

.fa option {

    font-weight: 900;
}

希望这对您有帮助。更好的是，我建议您在此链接中选择帅气的前端框架 Materialize CSS。。我一直在我的前端工作中使用它。