将静态（li）项目更改为图标

Question

简短的故事：我想将列表项更改为每个列表项的唯一图标。

长篇故事： 我在wp中使用目录主题（可列表），用户可以从自定义清单中选择0-3选项，使用分类法＆＃34; job_listing_type＆＃34;（我使用wp管理器字段编辑器插件）。插件以li形式输出选项（纯HTML）。我想有图标而不是文字。

例如：这可能是清单的输出：

<div id="jmfe-wrap-job_serveras" class="jmfe-custom-field-wrap">
  <li id="jmfe-custom-job_serveras" class="jmfe-custom-field ">Alkohol</li>
  <li id="jmfe-custom-job_serveras" class="jmfe-custom-field ">Endast vegetariskt</li>
  <li id="jmfe-custom-job_serveras" class="jmfe-custom-field ">Griskött</li>
</div>

如您所见，li id是静态的，因此我无法通过指出它来更改图标。可以改变＆＃34; li＆＃34;无论我喜欢什么。

这就是我想要显示列表项的方式：

有关如何操作的任何建议？无论是css还是javascript，无论在Wordpress中有什么用。

Answer 1

您可以使用fontawesome或引导程序glyphicon 您需要做的就是包括库的css和js文档。