IE中伪元素之前列表中绝对定位的图像内容（11）

Question

我正在尝试在 :before 伪元素上设置图像。当然，它适用于除 IE11 之外的所有浏览器。这里的定位不符合预期。

<ol>
    <li>
        :before

li {
    position: relative;
}

li:before {
    content: url('image.svg');
    position: absolute;
    width: 2.3em
    top: 2.5em;
    left: 1.2em;
}

问题是IE11的图片内容好像有问题。它适用于文本，但不适用于 content: url().

这是带有 top: 0; left: 0; 的文本的样子：

这就是图像 top: 0; left: 0; 的样子：

IE11 是否需要一些特殊的东西才能完成这项工作。或者只是不可能以这种方式做到这一点？您将如何定位这些元素，以便它们在大多数浏览器和 IE11 中工作？

Answer 1

不要使用 content，请尝试使用 background-image 属性并根据需要调整位置...

li:before {
    content: '';
    background-image: url('image.svg');
    position: absolute;
    display: block;
    width: 2.3em;
    height: //
    background-size: //
    top: 2.5em;
    left: 1.2em;
}

IE中伪元素之前列表中绝对定位的图像内容（11）

absolute positioned image content on list before pseudo element in IE (11)

css

css-position

absolute

internet-explorer-11