Html 如何在显示蓝色箭头之前<；李>；而不是使用媒体查询以IE 9及更高版本为目标？

我有以下问题：IE 11（IE 9及以上）中缺少蓝色箭头。在Google Chrome和Mozilla Firefox上运行良好

使用此代码：

ul.list li::before {
    font-family: "Glyphicons Halflings";
    content: "";
    color: #1CAFED;
    display: table-cell;
    padding-right: 10px;
    font-size: 0.65em;
}

<ul class="list">
    <li>
        <a href="/werken-in/amsterdam">Amsterdam</a>
    </li>
</ul>

@media all and (-ms-high-contrast: none) {
    .formatted ul li span {
        display: block;
        float: right;
        text-align: left;
        width: 96.23%;
    }

.formatted ul li::before {
display: inline-block;
    width: 3.77%;
  }
}

ul.list li::before {
font-family: "Glyphicons Halflings";
content: "";
    color: #1CAFED;
    display: table-cell;
    padding-right: 10px;
    font-size: 0.65em;
}

<ul>
    <li>
        <span>Amsterdam</span>
    </li>
</ul>

ul.list li:：之前{
字体系列：“半人字形”；
内容：“";
颜色：#1个标记；
显示：表格单元格；
右边填充：10px；
字号：0.65em；
}

如您所见，IE中没有蓝色箭头：

在Chrome/Firefox中，它显示了以下内容：

我使用以下代码解决了此问题：

ul.list li::before {
    font-family: "Glyphicons Halflings";
    content: "";
    color: #1CAFED;
    display: table-cell;
    padding-right: 10px;
    font-size: 0.65em;
}

<ul class="list">
    <li>
        <a href="/werken-in/amsterdam">Amsterdam</a>
    </li>
</ul>

@media all and (-ms-high-contrast: none) {
    .formatted ul li span {
        display: block;
        float: right;
        text-align: left;
        width: 96.23%;
    }

.formatted ul li::before {
display: inline-block;
    width: 3.77%;
  }
}

ul.list li::before {
font-family: "Glyphicons Halflings";
content: "";
    color: #1CAFED;
    display: table-cell;
    padding-right: 10px;
    font-size: 0.65em;
}

<ul>
    <li>
        <span>Amsterdam</span>
    </li>
</ul>

@媒体全部和（-ms高对比度：无）{
.李斯潘先生{
显示：块；
浮动：对；
文本对齐：左对齐；
宽度：96.23%；
}
.李：：以前{
显示：内联块；
宽度：3.77%；
}
}
李：之前{
字体系列：“半人字形”；
内容：“";
颜色：#1个标记；
显示：表格单元格；
右边填充：10px；
字号：0.65em；
}


阿姆斯特丹

---

请注意@media query.“-ms high contrast”的目标是IE 9和更高版本。我正在寻找更干净的（单向）解决方案将同时适用于IE和Chrome，而不是仅针对IE 9及以上版本使用媒体查询。有人能帮我吗？如果有什么不清楚的地方，请告诉我，我会尽力解释。

我自己解决了：

使用此代码：

ul.list li::before {
    font-family: "Glyphicons Halflings";
    content: "";
    color: #1CAFED;
    padding-right: 10px;
    font-size: 1rem;
    display: inline; <-------- instead of display: table-cell;
    padding-top: 3px;
}

ul.list li:：之前{
字体系列：“半人字形”；
内容：“";
颜色：#1个标记；
右边填充：10px；
字号：1rem；
显示：内联；使用
：before
而不是
：：before
，IE对
：
CSS3伪元素选择器的支持很差。@Terry尝试过，但不幸没有起到作用