是否会为其他浏览器加载 CSS3PIE .htc 文件，即使他们不需要？

Posted 2023-05-08

【中文标题】是否会为其他浏览器加载 CSS3PIE .htc 文件，即使他们不需要？

【英文标题】：Will CSS3PIE .htc file load for other browsers even they don't need?

【发布时间】：2011-08-02 08:27:08

【问题描述】：

我正在使用CSS3Pie 在使用无效 CSS 属性的 IE 中制作圆角

behavior: url(/PIE.htc);

如果我在我的主 CSS 中保留这个声明，其他浏览器是否会加载这个 .htc 文件，即使他们不需要这个文件，或者只有 IE 会加载这个文件？

在性能方面将behavior: url(/PIE.htc);单独保留为IE条件样式表有什么好处吗？

<!--[if lt IE 9]>
        <link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->

整个代码是这样的

border: 1px solid #696;
padding: 60px 0;
text-align: center; width: 200px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
background: #EEFF99;
behavior: url(/PIE.htc);

【问题讨论】：

相关：***.com/questions/8545501/…

【参考方案1】：

规范说browsers are to completely ignore declarations whose property names they don't recognize。这意味着，从理论上讲，由于behavior 是一个仅限 IE 的属性，因此不应解析 url()，并且该文件不能被 IE 以外的浏览器下载。

我在 IE9 和 Firefox 4 上进行了测试，加载了 the CSS3 PIE tabs demo，这是 F12 开发人员工具和 Firebug 分别在其网络选项卡中显示的内容。请注意，Firebug 报告没有尝试请求 /PIE.htc 文件。这意味着即使在您的样式表中声明了该文件，Firefox 也不会加载该文件，因为它无法识别 behavior 属性。

IE9（F12 开发者工具）

Firefox 4 (Firebug)

我将该属性移动到带有条件 cmets 的仅限 IE 样式表的唯一原因是，如果我不想用非标准属性和/或 hack 污染我的主样式表。

【讨论】：

但是由于 IE9 支持默认的 CSS 3 边框半径属性，那么它会使用 .htc 文件渲染角落还是将 css 用于 broder-readius？

@Jitendra Vyas：不太确定。如果您愿意，可以将 behavior 移动到 IE9 看不到的单独样式表。

【参考方案2】：

没有必要。 behavior 属性对所有其他浏览器无效，就像-moz-border-radius 对 IE 一样。您可能想使用后一种方法来阻止 IE9 加载该行为，但目前市场份额还不够。

【参考方案3】：

更新的答案（2014 年 2 月），因为它似乎是一个相当不清楚的主题。

它的工作方式是通过“行为”属性触发 HTC 库的加载。

“行为”仅是 IE6-9 属性，see MS official website "Support for element behaviors and html components (HTCs) has been removed in Internet Explorer 10 standards and quirks modes for improved interoperability and compliance with HTML5."

因此，“行为”属性只能在 IE6-9 上使用时触发任何内容的加载。

库应该永远不会为 IE10+ 或其他浏览器（即 Chrome、Firefox、Safari 等）加载

我以与@BoltClock 相同的方式进行了测试，发现当我在IE6-9 浏览器上不 时，也没有加载htc，也没有加载js，正如预期的那样。我在 IE8、IE9、Chrome 32、IE11 和 Firefox 27 上进行了测试（请参见下面的屏幕截图）。

我会尝试花更多时间进一步测试，也许我错过了一些东西。 同时，任何人都可以使用官方演示页面css3pie.com/demos/ 和browserstack.com 进行测试（他们有免费试用）。

Chrome、Firefox 和 IE11 未按预期加载 css3pie js 库：

注意：“dynamisch skripts”目录列出了页面内直接添加的javascript（不引用单独的js文件）

IE9 加载了一个 css3pie js 库，正如预期的那样：

IE8 加载了一个 css3pie js 库，正如预期的那样：

注意 1：注意为 IE8 和 IE9 加载的库是不同的。

注意 2：chrome、firefox 和 IE11 不加载任何 css3pie 库，但可能会加载一些 css3pie CSS，这可能需要进一步测试。