10

我正在使用CSS3Pie htc 文件border-radius在 IE8 中启用，但没有任何效果。我的 CSS 是：

button {
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    behavior: url(PIE.htc);
}

我已经将 PIE.htc 放在公共根目录中（就像在 CSS3PIE 演示页面上所做的那样），在同一个文件夹中尝试过，使用相对 uri 和绝对 uri。

演示正在运行；只是不是我的代码！

谢谢，亚当

4

6 回答 6

29

尝试添加

position:relative;
z-index: 0;

正如这里建议的那样http://css3pie.com/forum/viewtopic.php?f=3&t=10

这个问题类似于此处发布的问题：

CSS3 PIE - 给 IE 边框半径支持不起作用？

于 2011-01-14T14:57:04.637 回答
4

中引用的 PIE.htc 的 URLbehavior: url(PIE.htc);是相对 URL，因此它可能在与样式表相同的目录中查找它，因此我建议添加斜杠以使其成为绝对 URL。但是你说你已经做到了。

检查您指定的 URL 是否确实加载了 PIE.htc 文件 - 即将该 URL 直接放入您的浏览器并查看结果。您的网络服务器可能由于某种原因无法正确提供服务（无法识别 MIME 类型？等）

您是否经历过PIE 网站上的已知问题？你添加position:relative;了你的风格吗？这可能是已知z-index问题吗？

您指定它在 IE8 中不起作用。你在IE7中试过吗？IE6？结果一样吗？（这将消除它成为 IE8 特定问题的可能性）

顺便说一句——不相关的一点，但你应该把border-radius样式放在带有浏览器特定前缀的版本下面。这是做事的标准方式，因为这意味着例如，当 Firefox 开始border-radius支持-moz-border-radius. 如果您拥有-moz低于它的版本，那么该版本将继续被使用，这可能不是您想要的。

于 2010-12-01T16:27:24.150 回答
3

正如 Daniel Rehner 所说，您需要使用 IE8 的 position: relative 和 z-index 属性。如果您使用带有子目录的网站来调用 CSS 文件，您还需要在 CSS 中使用 PIE.htc 的绝对路径——这是我们问题的一部分。

问题的另一部分可能是您的服务器没有将 PIE.htc 文件输出为 text/x-component。您可以通过 IIS 或 Apache 更正它，或者在您的 CSS 中调用 PIE.php 脚本。更多信息在这里：http ://css3pie.com/documentation/known-issues/#content-type

这两个问题都得到了我们，希望他们能帮助你。

于 2011-08-03T14:59:46.117 回答
2

实际上，我出于完全不同的原因遇到了这个问题。

如果将过滤器应用于同一元素，则边框半径将不起作用。我将边框半径应用于一个按钮，并将线性渐变用作过滤器。一旦我删除了过滤器，边界半径就起作用了。

这是记录在案的行为，应使用以下方法应用渐变-pie-background：

http://css3pie.com/documentation/supported-css3-features/#gradients

于 2014-03-14T13:23:58.420 回答
1 
behavior: url(PIE.htc);

确保 和 之间没有空格url，(因为这会阻止它在 IE8 中工作

于 2011-04-15T16:14:36.740 回答
1

以防万一有人试图将此应用于表格单元格，您需要将其应用于position: relative元素table（而不是tdor th，即使这些是被四舍五入的元素）。

于 2012-07-16T07:53:44.130 回答