如何使用border-radius.htc在IE中制作圆角。

Question

如何使用border-radius.htc插件在IE中实现圆角边框

我正在使用border-radius.htc来修复IE中的border-radius问题。

它在这里表现非常出色：http://www.faressoft.org/eshterakat/border-radius/border-radius.html 但是它在我的HTML页面中不起作用！我不知道为什么！

请查看http://www.faressoft.org/eshterakat/。

-moz-border-radius:5px;
-khtml-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
behavior:url('Js/border-radius.htc'); 

/* I tried '../Js/border-radius.htc' it didn't work too */
/* I tried '/Js/border-radius.htc' it didn't work too */
/* I tried 'Js/border-radius.htc' it didn't work too */

- faressoft

Answer 1

HTC存在两个需要注意的地方；

• 服务器必须以正确的MIME类型(text/x-component)提供HTC服务，如果您使用Apache，请将以下内容添加到配置或.htaccess文件中: AddType text/x-component .htc

• CSS URL与CSS文件相关联...HTC引用与调用HTML页面相关联-请小心。

- Chris Bentley

---

这个页面http://www.faressoft.org/eshterakat/border-radius/border-radius.html存在于我的服务器上并且运行正常! - faressoft

它在这里http://www.faressoft.org/eshterakat/border-radius/border-radius.html是有效的，但在这里http://www.faressoft.org/eshterakat/无效。 - faressoft

我不确定为什么其中一个有效，因为您似乎正在将HTC作为text/plain提供服务。 - Chris Bentley

我正在使用WAMP服务器。我应该在哪里添加.htc文件？没有config或.htaccess文件。谢谢！ - Chris22

@Chris22 你可以将 .htc 文件放在网站根目录下的任何位置 -- 这是一个 ADDType 声明，你需要将其添加到你的 httpd.config 或 .htaccess 文件中。 - Chris Bentley

@ChrisBentley 谢谢，我记不得 httpd.config 文件在哪里了！我在我的桌面上启动 WAMP 控制面板后找到了它。 - Chris22

Answer 2

只需编辑border-radius.htc文件即可。

fill.color = fillColor;

转化为

fill.color = (fillColor=='transparent') ? 'none': fillColor;

将CSS文件和HTC文件更改并放置在同一个文件夹中，例如文件夹名称为"cssSupport"，那么它应该像这样：

zoom:1;
display: block;
background-color:Transparent;
border: 1px solid #696;   
-webkit-border-radius:8px;   
-moz-border-radius:8px;   
border-radius:8px;
border-bottom-right-radius:8px;   
border-bottom-left-radius:8px;   
behavior:url(../CSS_Support/border-radius.htc);

试一试，这肯定有效。享受IE8吧。

- bharat bhushan sharma

---

我一直在尝试在IE8中正确设置一些边框。您的if解决了我的背景颜色问题！非常感谢。 - nrod

Answer 3

这实际上是一些具体的内容，只是简单地提到了。

在使用HTC组件时，您需要确保它们位于站点根位置。然后，您只需提到behavior:url(css3orw/e.htc);

在这种情况下，URL与您在CSS中引用图像的方式不同。这永远不需要您执行一些url(../../asf.ext)等操作，这可能是您在处理CSS中图像的相对性质时所使用的。

- Graphical Insight