Html Internet Explorer 9或旧版本中的css线性渐变

我使用线性渐变标签制作1倍宽度的斜线。在IE中，这样看起来很模糊。其他浏览器（Opera、Google Chrome、Firefox、Safari）正确显示了这一行

@media (min-width: 986px) {
     .issue .issue-descr {
         border-top: solid 1px #fff;
     }
     .issue .issue-descr:after {
        content: "";
        background: -ms-linear-gradient(to top right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) calc(50% - 1px), rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) calc(50% + 1px), rgba(255, 255, 255, 0) 100%);      
        background: -webkit-linear-gradient(to top right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) calc(50% - 1px), rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) calc(50% + 1px), rgba(255, 255, 255, 0) 100%);      
        background: -moz-linear-gradient(to top right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) calc(50% - 1px), rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) calc(50% + 1px),  rgba(255, 255, 255, 0) 100%); 
        background: linear-gradient(to top right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) calc(50% - 1px), rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) calc(50% + 1px), rgba(255, 255, 255, 0) 100%);
        width: 40px;
        height: 30px;
    } 
}

即 -谷歌浏览器

修复

@介质（最小宽度：986px）{ .问题.问题说明{ 边框顶部：实心1px#fff； } .问题.问题描述：之后{ 内容：；背景：线性渐变（右上角，rgba（255，255，255，0）20px，rgba（255，255，255，0）计算（50%-1px）， rgba（255，255，255，1）25px，rgba（255，255，255，0）计算（50%+1px）， rgba（255，255，255，0）20px；宽度：40px；高度：30px； }}

---

请格式化您的代码，我建议使用。易于使用和支持，即6-9。只要做你想要的渐变，复制并粘贴到你的代码中。是的，ColorZilla是你的解决方案！这可能是一个bug，检查一下，第一次运行是bug，但如果您再次单击“run”，它将被渲染为罚款，它也发生在ie11上