PIE CSS适用于IE9但不适用于IE8 [英] PIE CSS works in IE9 but not IE8

问题描述

对于这个项目，我正在使用Tomcat 7并将其配置为提供 htc ，内容类型为 text / x-component

For this project, I am using Tomcat 7 and have configured it to serve htc with content type of text/x-component

<?xml version="1.0" encoding="UTF-8"?>
<web-app ...>
    ...
    <mime-mapping>
            <extension>htc</extension>
            <mime-type>text/x-component</mime-type>
    </mime-mapping>
</web-app>

出于某种原因，它适用于IE9（渐变，阴影，圆角），但不适用于IE8 ，根本看不到任何CSS3生效。在styles / tracxe样式下的开发者控制台中，我看到行为但我看不到像 -pie-background 例如。那是问题吗？

For some reason, it works in IE9 (gradients, drop shadows, rounded corners) but not in IE8, dont see any CSS3 in effect at all. In the developer console under styles/tracxe styles, I see behavior but I don't see anything like -pie-background for example. Is that a problem?

可能是什么原因，它似乎很奇怪它在IE9中工作但不在IE8中。我不认为我需要不同的设置或类似的东西？ 1个元素的CSS：

What might be the cause, it seems wierd that it works in IE9 but not IE8. I don't suppose I need different setup or anything like that? CSS of 1 element:

#masthead {
  background: #0E0E0E;
  background: #0e0e0e;
  background: -moz-linear-gradient(center top, #7d7d7d 0%, #0e0e0e 100%);
  background: -webkit-linear-gradient(top, #7d7d7d 0%, #0e0e0e 100%);
  background: -o-linear-gradient(top, #7d7d7d 0%, #0e0e0e 100%);
  background: -ms-linear-gradient(top, #7d7d7d 0%, #0e0e0e 100%);
  background: linear-gradient(top, #7d7d7d 0%, #0e0e0e 100%);
  -pie-background: linear-gradient(top, #7d7d7d 0%, #0e0e0e 100%);
  behavior: url(/owmw/web/css/PIE.htc);
  height: 35px;
  border: 1px solid #000000;
  color: #FFFFFF;
  position: relative;
  text-align: center;
  margin: 0px auto;
}

我在IE8兼容模式下使用IE10，这有关系吗？

I am using IE10 in IE8 compatibility mode, does it matter?

推荐答案

我也面临同样的问题，以下是我遇到问题的原因：

I too faced the same issue and following was the reason for my problem:

• 我对 DIV 元素使用了错误的定位。


• 我的目标是行为中的错误路径。

• I used a wrong positioning for my DIV element.
• I was targeting the wrong path in behavior.

从您的代码中，问题似乎是定位错误的路径。

行为：url（/owmw/web/css/PIE.htc）;

From your code, the problem seems to be in targeting the wrong path.
behavior: url(/owmw/web/css/PIE.htc);

FIX：
而是尝试在css文件夹中引用PIE.htc文件并使其看起来像行为：url（PIE.htc ）;

或

使用行为：url（owmw / web / css / PIE.htc）;

查看行为属性。

我可能错了，但这解决了我的问题。

I might be wrong, but this solved my issue.

即使我尝试使用行为：url（../ owmw / web / css / PIE.htc）; 但是没有用。

Even I tried using behavior: url(../owmw/web/css/PIE.htc); but not worked.

从您的评论中，您似乎正在使用 X-UA-Compatible 作为修复它只能通过IE10兼容模式工作。

From your comments, it seems you're using X-UA-Compatible as a fix and it works only through IE10 compatibility mode.

!--  Force IE to use the latest version of its rendering engine -->  
<meta http-equiv="X-UA-Compatible" content="IE=edge">

告诉IE在您的页面中使用其最新版本的渲染引擎。
如果您的用户在IE8浏览器中打开，请注意？这肯定会失败。

By telling IE to use the latest version of its rendering engine in your page. Incase if your user opens in IE8 browser? This will certainly fails.

您可以在 MSDN Library 。

希望你理解。

这篇关于PIE CSS适用于IE9但不适用于IE8的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！