html – CSS3和PIE在IE 8中不起作用

发布时间：2020-12-14 21:39:43 所属栏目：资源来源：网络整理

导读：我试图演示CSS3PIE，它不会在IE中工作。 HTML： !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"html head meta http-equiv="content-type" content="text/html; charset=windows-1250" link href="test.css" type="text/css" rel="styleshe

我试图演示CSS3PIE，它不会在IE中工作。

HTML：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <link href="test.css" type="text/css" rel="stylesheet">
  <title>Test</title>
  </head>
  <body>

    <div id="title"></div>
    <div id="sub_title"></div>
    <div id="main_area">
      <div id="date_area"></div>
    </div>

  </body>
</html>

CSS：

body{
 margin: 0 auto;
}

#title{
 margin: 0 auto;
 width: 100%;
 height: 40px;
 background-color: white;
}

#sub_title{
  margin: 0 auto;
  width: 100%;
  height: 25px;
  background-color: green;
}

#date_area{
  width: 310px;
  height: 250px;
  border: 1px solid #4A4949;
  padding: 60px 0;
  text-align: center; 
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px;
  -webkit-box-shadow: #707070 2px 2px 4px;
  -moz-box-shadow: #707070 2px 2px 4px;
  box-shadow: #707070 2px 2px 4px;
  background: #EBEBEB;
  background: -webkit-gradient(linear,0 0,0 bottom,from(#EDEBEB),to(#C9C7C8));
  background: -moz-linear-gradient(#EDEBEB,#C9C7C8);
  background: linear-gradient(#EDEBEB,#C9C7C8);
  -pie-background: linear-gradient(#EDEBEB,#C9C7C8);
  behavior: url(/PIE.htc);  
}

结果只是一个边框，没有渐变/阴影等

任何帮助/解决方案将不胜感激。

解决方法

行为位置应该是相对于你的HTML文件，而不是你的CSS像使用url()的任何其他声明。所以假设你的index.html和PIE.htc在根目录下，你的CSS在’css’文件夹中，你应该这样做：

background-image: url(../images/example.jpg);
behavior: url(PIE.htc);

另外，尝试在与PIE.htc文件相同的位置添加以下内容的.htaccess文件：

AddType text/x-component .htc

希望这可以帮助。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!