html - CSS Font Awesome 图标在 IE 10 中可点击

Question

我在 css 中添加了 Fontawesome 图标以在选择下拉列表中显示它 现在我无法在 IE 10 中单击 Fontawesome 图标 谁能知道如何解决这个问题

HTML

<div class="select">
  <select>
    <option value="">Order By</option>
    <option value="1">ID</option>
    <option value="2">Details</option>
  </select>
</div>

CSS

.select {
  position: relative
}

.select select {
  -webkit-appearance: none;
  -webkit-border-radius: 0px;
  -moz-appearance: none;
  appearance: none;
  border: 0;
  background-color: #e5e5e5;
  height: 30px;
  padding: 0 20px;
  width: 100%;
  position: relative;
  margin-bottom: 0;
}

.select select::-ms-expand {
  display: none;
}

.select:after {
  content: '\f0d7';
  font-family: 'FontAwesome';
  font-size: 16px;
  color: #000;
  position: absolute;
  right: 15px;
  top: 6px;
  pointer-events: none;
}

Fiddle

Answer 1

如果你想要 icons除了下拉列表中的现有元素外，您还必须在 HTML 元素旁边添加您想要的元素。意思是，您必须添加特定的 FontAwesome icon在您的下拉元素旁边以供显示。如果那是你的问题。

像这样； <option value=""><i class="fa fa-your-content"></option> .

否则无论你怎么努力它都不会显示。

---

此外，您是否已链接到 FontAwesome 源或 CDN？因为没有源代码，您无法显示任何自定义元素。