16

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);  
}

結果は、境界線のあるブロックであり、グラデーション/シャドウなどはありません。

任意のヘルプ/ソリューションをいただければ幸いです。

4

6 に答える 6

34

場所は、behaviorを使用する他の宣言のようにCSSではなく、HTMLファイルを基準にする必要がありますurl()。したがって、とがルートにあり、CSSが「css」フォルダー内にあると仮定するindex.htmlとPIE.htc、次のようになります。

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

.htaccessまた、ファイルと同じ場所に次の内容のファイルを追加してみてくださいPIE.htc。

AddType text/x-component .htc

お役に立てれば。

于 2011-01-12T19:13:03.317 に答える
14

追加してみてください

position:relative;
z-index: 0;

ここで提案されているようにhttp://css3pie.com/forum/viewtopic.php?f=3&t=10

この質問は、ここに投稿された質問と似ています：CSS3 PIE-IEボーダー半径サポートを提供していませんか？

于 2011-01-13T23:38:29.557 に答える
4

CSS3 PIE-IEボーダー半径サポートを提供していませんか？

PIE.htcリクエストは、mimeタイプ「text /x-component」で応答する必要があります。そうしないと、IEは動作に影響を与えません。

于 2011-01-12T00:22:59.877 に答える
4

追加：AddType text/x-component .htc -.htaccessファイルへの追加は私にとって魅力のように機能しました。

省略形のCSSプロパティを使用すると、どのコーナーを丸めるかどうかを制御できます。

border-radius: 0 15px 15px 0;/*(top-left, top-right, bottom-right, bottom-left). */

于 2011-12-12T20:28:37.267 に答える
2

ブラウザのキャッシュをクリアしてみてください。特に互換モードを切り替える場合。それは本当に役立ちます

于 2011-12-02T10:00:44.063 に答える
0

最新のベータリリースがあることを確認してください。それでもHTCファイルで問題が発生する場合は、JSの実装を試してください。

于 2011-01-11T23:01:41.257 に答える