Warning: file_get_contents(/data/phpspider/zhask/data//catemap/5/spring-mvc/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Internet explorer CSS渐变在IE9中有效吗?_Internet Explorer_Css_Gradient_Internet Explorer 9 - Fatal编程技术网

Internet explorer CSS渐变在IE9中有效吗?

Internet explorer CSS渐变在IE9中有效吗?,internet-explorer,css,gradient,internet-explorer-9,Internet Explorer,Css,Gradient,Internet Explorer 9,不幸的是,我还没有一台可以测试IE9的机器(仍在XP中),browsershots也还没有测试IE9。有人能告诉我IE9是否支持css渐变吗?这是一个应用了渐变的页面。它有用吗 它没有 请看这里: 不过,它将支持SVG作为背景,目前用于为Opera制作渐变。根据IE9,IE9不支持渐变 IE9不支持CSS渐变。 请看的底部。IE9目前缺少CSS3梯度支持。然而,这里有一个很好的解决方案,使用PHP返回SVG(垂直线性)渐变,这允许我们将设计保留在样式表中 <? header('Conte

不幸的是,我还没有一台可以测试IE9的机器(仍在XP中),browsershots也还没有测试IE9。有人能告诉我IE9是否支持css渐变吗?这是一个应用了渐变的页面。它有用吗

它没有

请看这里:


不过,它将支持SVG作为背景,目前用于为Opera制作渐变。

根据IE9,IE9不支持渐变

IE9不支持CSS渐变。


请看的底部。

IE9目前缺少CSS3梯度支持。然而,这里有一个很好的解决方案,使用PHP返回SVG(垂直线性)渐变,这允许我们将设计保留在样式表中

<?

header('Content-type: image/svg+xml; charset=utf-8');
echo '<?xml version="1.0"?>
';

$from_stop = isset($_GET['from']) ? $_GET['from'] : '000000';
$to_stop = isset($_GET['to']) ? $_GET['to'] : '000000';

?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.0" preserveAspectRatio="none" width="100%" height="100%">
    <defs>
        <linearGradient id="linear-gradient" x1="0%" y1="0%" x2="0%" y2="100%" spreadMethod="pad">
            <stop offset="0%" stop-color="#<?=$from_stop?>" stop-opacity="1"/>
            <stop offset="100%" stop-color="#<?=$to_stop?>" stop-opacity="1"/>
        </linearGradient>
    </defs>
    <rect width="100%" height="100%" style="fill: url(#linear-gradient);"/>
</svg>
这可以与CSS3渐变一起使用,如下所示:

.my-color {
    background-color: #f00;
    background-image: url(gradient.php?from=f00&to=00f);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f00), to(#00f));
    background-image: -webkit-linear-gradient(top, #f00, #00f);
    background-image: -moz-linear-gradient(top, #f00, #00f);
    background-image: linear-gradient(top, #f00, #00f);
}
如果您需要将目标锁定在IE9以下,您仍然可以使用旧的专有“过滤器”方法:

.ie7 .my-color, .ie8 .my-color {
    filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#ff0000", endColorStr="#0000ff");
}

当然,您可以修改PHP代码以在渐变上添加更多的停止点,或者使其更复杂(径向渐变、透明度等),但这对于那些简单(垂直)线性渐变非常有用。

好的,所以它不起作用,但是我们如何在HTML中的元素上使用SVG?SVG对我来说是全新的。@David:看看这个:注意Opera从v11.10开始就支持线性渐变:谢谢neave。。。这里是我的.NET版本:[[1]:
.ie7 .my-color, .ie8 .my-color {
    filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#ff0000", endColorStr="#0000ff");
}