CSS pie 在 IE 8 中不工作，但在 IE 9 中工作

Posted 2023-05-08

【中文标题】CSS pie 在 IE 8 中不工作，但在 IE 9 中工作

【英文标题】：CSS pie not working in IE 8, but working in IE 9

【发布时间】：2013-02-16 17:50:13

【问题描述】：

我正在使用以下代码作为边框半径：

.box 
     width:250px;
     height:250px;
     background:#ce0000;
     border-top-left-radius: 15px;
     border-bottom-left-radius: 5px;
     border-bottom-right-radius: 5px;
     border-top-right-radius: 15px;
     behavior:url(images/PIE.htc);

它在 IE 9 中运行良好。但它在 IE 8 中不起作用。我做错了什么？

【问题讨论】：

边框半径在ie8及更少版本的ie中不支持

@sasi 检查 CSS3Pie 并查看。 pie 就是这么做的，它把这个特性添加到 IE 中。

我觉得images/PIE.htc 无法访问。能把你的文件夹结构和文件结构放进去吗？

有时位置相对在 IE8 中会有所帮助，请尝试一下（这看起来很愚蠢，但过去对我有用——原因我不知道）

文件夹和文件结构正确@praveen Kumar

【参考方案1】：

根据文档，PIE 仅支持速记边界半径规则：

对于 PIE 解析的所有 CSS 属性，只会识别这些属性的简写版本。例如，虽然 支持border-radius，单独的速记 border-top-left-radius 等属性没有。

原因与 URL 未相对解析的原因相同 到 CSS 文件（见上文）：PIE 无法查看位置 每个样式属性都来自。如果同时存在速记和 存在速记属性时，PIE 无法确定 CSS作者指定了那些属性，也无法确定 每个属性的选择器的特异性。因此不能 就应该优先考虑哪个属性做出明智的决定。

为避免做出愚蠢的猜测，我们选择仅支持速记 特性。选择速记而不是速记以保持文件较小 并避免繁琐的重复。

http://css3pie.com/documentation/known-issues/#shorthand

所以试着把你的 CSS 改成这样：

.box 
     width:250px;
     height:250px;
     background:#ce0000;
     border-radius : 15px 15px 5px 5px;
     behavior:url(images/PIE.htc);

【讨论】：

感谢它现在使用速记代码 .box width:250px;高度：250px；背景：#ce0000;边框半径：15px 15px 5px 5px；行为：网址（图片/PIE.htc）；