Вопросы Теги

Цвета градиента в Internet Explorer

49
задан Blowsie 28 February 2013 в 05:07
поделиться

4 ответа

Посмотрите на пользовательский IE фильтров CSS, может обработать http://msdn.microsoft.com/en-us/library/ms532847.aspx

23
ответ дан Nick 7 November 2019 в 11:23
поделиться

Прямо из статьи ScriptFX.com : 

<body bgcolor="#000000" topmargin="0" leftmargin="0">

    <div style="width:100%;height:100%; filter: progid:
        DXImageTransform.Microsoft.Gradient (GradientType=1,
        StartColorStr='#FF006600', EndColorStr='#ff456789')">

Your page content goes in here ...... at the end of all the page content, you must close the <div> tag, immediately before the closing <body> tag.... as below

    </div>
</body>
2
ответ дан vmarquez 7 November 2019 в 11:23
поделиться

Стиль фильтра должен работать для IE8 и IE9. 

.gradientClass
{
  filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#e6e6e6', endColorstr='#CCCCCC');       
}
11
ответ дан 7 November 2019 в 11:23
поделиться

Код, который я использую для всех градиентов браузера: 

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;

Вам нужно будет указать высоту или масштаб: 1 , чтобы применить hasLayout к элемент, чтобы это работало в IE.

Обновление:

Вот версия LESS Mixin (CSS) для всех пользователей LESS: 

.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;
}
83
ответ дан 7 November 2019 в 11:23
поделиться