的CSS Gradiant无法在Internet Explorer工作，当CSS翻转

我有一个渐变的CSS代码良好的所有浏览器的CSS Gradiant无法在Internet Explorer工作，当CSS翻转

header{ 
padding:0px 0; 
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+13,3e6d9f+40 */ 
    background: rgb(255,255,255); /* Old browsers */ 
    background: -moz-linear-gradient(left, rgba(255,255,255,1) 13%,rgba(0,119,159,0.5) 40%); /* FF3.6+ */ 
    background: -webkit-gradient(linear, left top, right top, color-stop(13%,rgba(255,255,255,1)), color-stop(40%,rgba(62,109,159,0.5))); /* Chrome,Safari4+ */ 
    background: -webkit-linear-gradient(left, rgba(255,255,255,1) 13%,rgba(62,109,159,0.5) 40%); /* Chrome10+,Safari5.1+ */ 
    background: -o-linear-gradient(left, rgba(255,255,255,1) 13%,rgba(62,109,159,0.5) 40%); /* Opera 11.10+ */ 
    background: -ms-linear-gradient(left, rgba(255,255,255,1) 13%,rgba(62,109,159,0.5) 40%); /* IE10+ */ 
    background: linear-gradient(to right, rgba(255,255,255,1) 13%,rgba(62,109,159,0.5) 40%); /* W3C */ 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#3e6d9f',GradientType=1); /* IE6-9 */ 
    position:relative; 
    z-index:1; 
}

工作和图像看起来像这样

然后我不得不翻转这个CSS为阿拉伯语版本和代码像

header{ 
padding:0px 0; 
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+13,3e6d9f+40 */ 
    background: rgb(255,255,255); /* Old browsers */ 
    background: -moz-linear-gradient(right, rgba(255,255,255,1) 87%, rgba(0,119,159,0.5) 40%) !important; /* FF3.6+ */ 
    background: -webkit-gradient(linear, right top, left top, color-stop(13%,rgba(255,255,255,1)), color-stop(40%,rgba(62,109,159,0.5))) !important; /* Chrome,Safari4+ */ 
    background: -webkit-linear-gradient(right, rgba(255,255,255,1) 87%,rgba(62,109,159,0.5) 40%); /* Chrome10+,Safari5.1+ */ 
    background: -o-linear-gradient(right, rgba(255,255,255,1) 87%,rgba(62,109,159,0.5) 40%); /* Opera 11.10+ */ 
    background: -ms-linear-gradient(right, rgba(255,255,255,1) 87%,rgba(62,109,159,0.5) 40%); /* IE10+ */ 
    background: linear-gradient(to left, rgba(255,255,255,1) 87%,rgba(62,109,159,0.5) 40%); /* W3C */ 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#3e6d9f',GradientType=1); /* IE6-9 */ 
    position:relative; 
    z-index:1; 
}

这个代码的工作以及所有broswers除了IE

在所有broswers图像翻转像

但Internet Explorer中显示错误见下文

添附图像请帮助我之前遇到过这个问题，有没有解决方法？好的答案必须明白

来源

2016-11-29 Jishnu V S

我不太明白，什么是阿拉伯语版本有做你的问题？它在英文版本中工作吗？还有哪个版本的IE导致了这个问题？另外一些html也会有帮助。 – Esko

任何潜水员可用？ – Yaser

@Esko阿拉伯语版本网站方向不同于英语 –

我得到的答案-ms-linear-gradient和linear-gradient安排从右到左减少％至13

header{ 
    padding:0px 0; 
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+13,3e6d9f+40 */ 
    background: rgb(255,255,255); /* Old browsers */ 
    background: -moz-linear-gradient(right, rgba(255,255,255,1) 87%, rgba(0,119,159,0.5) 40%) !important; /* FF3.6+ */ 
    background: -webkit-gradient(linear, right top, left top, color-stop(13%,rgba(255,255,255,1)), color-stop(40%,rgba(62,109,159,0.5))) !important; /* Chrome,Safari4+ */ 
    background: -webkit-linear-gradient(right, rgba(255,255,255,1) 87%,rgba(62,109,159,0.5) 40%); /* Chrome10+,Safari5.1+ */ 
    background: -o-linear-gradient(right, rgba(255,255,255,1) 87%,rgba(62,109,159,0.5) 40%); /* Opera 11.10+ */ 
    background: -ms-linear-gradient(right, rgba(255,255,255,1) 13%,rgba(62,109,159,0.5) 40%); /* IE10+ */ 
    background: linear-gradient(to left, rgba(255,255,255,1) 13%,rgba(62,109,159,0.5) 40%); /* W3C */ 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#3e6d9f',GradientType=1); /* IE6-9 */ 
    position:relative; 
    z-index:1; 
}

来源

2016-11-29 16:39:28

的CSS Gradiant无法在Internet Explorer工作，当CSS翻转

回答

相关问题