Css 关闭IE 11上无白色x的图标

将很难看到，但在右上角，当我使用Chrome查看时，它有一个带白色X的黑色圆圈，但在IE中没有白色X。你知道为什么或者如何让白色X出现在IE中吗

.close-icon
{
    position: absolute;
    top: -5px;
    right:-5px;
    display:block;
    box-sizing:border-box;
    width:20px;
    height:20px;
    border-width:3px;
    border-style: solid;
    border-color:black;
    border-radius:100%;
    background: -webkit-linear-gradient(-45deg, transparent 0%, transparent 46%, white 46%,  white 56%,transparent 56%, transparent 100%), -webkit-linear-gradient(45deg, transparent 0%, transparent 46%, white 46%,  white 56%,transparent 56%, transparent 100%);
    background-color:black;
    box-shadow:0px 0px 5px 2px rgba(0,0,0,0.5);
    transition: all 0.3s ease;
}

---

IE不支持

-webkit-

前缀，因此它忽略了渐变，因此不进行渲染。更好的解决方案是完全忽略梯度，并使用显式符号，例如

。关闭{
边界半径：50%；
宽度：20px；
高度：20px；
位置：绝对位置；
顶部：10px；
右：10px；
背景色：黑色；
文本对齐：居中；
线高：20px；
盒影：0.5px2pRGBA（0,0,0,0.5）；
}
.关闭：：之前{
内容：“×”；
颜色：白色；
}

---

IE不支持

-webkit-

前缀，因此它忽略了渐变，因此不进行渲染。更好的解决方案是完全忽略梯度，并使用显式符号，例如

。关闭{
边界半径：50%；
宽度：20px；
高度：20px；
位置：绝对位置；
顶部：10px；
右：10px；
背景色：黑色；
文本对齐：居中；
线高：20px；
盒影：0.5px2pRGBA（0,0,0,0.5）；
}
.关闭：：之前{
内容：“×”；
颜色：白色；
}

---

IE不支持

-webkit线性渐变

…它是否支持类似的东西，可以给我一个像那样的白色X？为什么不渲染一个“X”字符或时间⨉" 字符而不是使用黑色渐变？我不知道使用渐变会被认为是黑色的。IE不支持

-webkit线性渐变

…它是否支持类似的东西，可以给我一个白色的X，就像那样？你为什么不渲染一个“X”字符或“times”⨉“角色而不是使用粗糙的渐变？我不知道使用渐变会被认为是粗糙的。