一尘不染

Internet Explorer中的渐变颜色

css

我知道Internet
Explorer具有一些专有扩展,因此您可以执行诸如创建具有渐变背景的div之类的操作。我不记得元素名称或其用法。有没有人有一些例子或链接?


阅读 249

收藏
2020-05-16

共1个答案

一尘不染

我用于所有浏览器渐变的代码:

background: #0A284B;
background: -webkit-gradient(linear, left top, left bottom, from(#0A284B), to(#135887));
background: -webkit-linear-gradient(#0A284B, #135887);
background: -moz-linear-gradient(top, #0A284B, #135887);
background: -ms-linear-gradient(#0A284B, #135887);
background: -o-linear-gradient(#0A284B, #135887);
background: linear-gradient(#0A284B, #135887);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0A284B', endColorstr='#135887');
zoom: 1;

您需要指定一个高度或zoom: 1将其应用于hasLayoutIE中的元素。

更新:

这是面向所有LESS用户的LESS Mixin(CSS)版本:

.gradient(@start, @end) {
    background: mix(@start, @end, 50%);
    filter: ~"progid:DXImageTransform.Microsoft.gradient(startColorStr="@start~", EndColorStr="@end~")";
    background: -webkit-gradient(linear, left top, left bottom, from(@start), to(@end));
    background: -webkit-linear-gradient(@start, @end);
    background: -moz-linear-gradient(top, @start, @end);
    background: -ms-linear-gradient(@start, @end);
    background: -o-linear-gradient(@start, @end);
    background: linear-gradient(@start, @end);
    zoom: 1;
}
2020-05-16