0

我正在尝试让线性渐变与 CSS3Pie (v1.0) 和 IE9 一起使用。

奇怪的是，该演示在带有 IE9 的CSS3Pie 站点上工作，但使用演示中使用的相同 CSS 在我的站点上不起作用。它适用于 IE8，所以我知道 PIE 正在工作并且在正确的位置（为了测试，如果我注释掉它就会停止工作behavior: url(/css/PIE.htc);）。

这是我正在使用的 CSS：

.test {
padding: 20px;
text-align: center;
width: 200px;
height:100px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: #666 0px 2px 3px;
-moz-box-shadow: #666 0px 2px 3px;
box-shadow: #666 0px 2px 3px;
background: #FF7777;
position:relative;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#FF7777), to(#c40808));
background: -webkit-linear-gradient(#FF7777, #c40808);
background: -moz-linear-gradient(#FF7777, #c40808);
background: -ms-linear-gradient(#FF7777, #c40808);
background: -o-linear-gradient(#FF7777, #c40808);
background: linear-gradient(#FF7777, #c40808);
-pie-background: linear-gradient(#FF7777, #c40808);
behavior: url(/css/PIE.htc);
}

在此处输入图像描述

我不想使用 IE 过滤器，因为演示似乎没有它们也能工作。

我已经阅读了这个问题，但是由于演示有效，而且这个问题已经有一年了，而且 PIE 现在是 1.0 版，我一定做错了。

关于从这里去哪里的任何想法？

4

2 回答 2

2

IE9 中的失败通常是由于不正确的内容类型标头。其他 IE 版本也有这个问题，但 IE9 似乎对此更严格。有关详细信息，请参阅http://css3pie.com/documentation/known-issues/#content-type。

于 2012-05-30T15:39:37.740 回答
0

我非常头疼，因为即使使用正确的内容类型标题（文本/x 组件），线性渐变在 IE9 上也不起作用。

升级到 PIE 2.0 解决了这个问题。

http://css3pie.com/2013/01/28/pie-2-0-beta-1-released

（我在这个问题中给出的相同的遮阳篷：linear-gradient using CSS3 PIE in IE9 not working, IE8 does）

于 2013-04-03T19:51:17.563 回答