0

良いブラウザーで作業していた css を Internet Explorer で使用できるように変換するのに助けが必要です。これは私が今持っているものです

.headerLoginFooter
{   
    background-color:#f5f5f5; 
    padding:7px 10px 7px 10px; 
    margin:20px 0 0 0; 
    -moz-box-shadow:inset 0 8px 6px -6px #c4c4c4; 
    -webkit-box-shadow:inset 0 8px 6px -6px #c4c4c4; 
    box-shadow:inset 0 8px 6px -6px #c4c4c4;
}

最後の 3 つの属性は、この div のログイン ボックスのフッター セクション内で内向きのグローを生成しています。

ここに画像の説明を入力

このスタイリングのコードはCSS Tricksから取得できましたが、これを Internet Explorer と互換性を持たせる必要があります。私の最初の問題は、Mac しか持っていないため、コードを簡単にテストするための Internet Explorer がないことです。私の2番目の問題は、彼がコードに持っているように、上記のコードを変換する方法がわからないことです。リンク内のガイドラインに従って、上記のコードを Internet Explorer で動作するように変換するのを誰かが手伝ってくれませんか。ありがとうございました。

4

1 に答える 1

0

IE は、多くの CSS3 機能、特に古いバージョンで非常に問題があります。

CSS スタイルシートで使用するには、CSSpieを使用することをお勧めします。これは以前ここで回答されています。

box-shadow が IE で機能しない場合があります: (同じ要素に適用されている場合)

  • 丸い角 /border-radius
  • overflow:hidden
  • background-color
  • 背景のグラデーション

これを克服するために、私は通常、ボックス シャドウでスタイルを設定したいコンテナーの中にコンテナーを入れ子にします。

<style>
.boxShadow {
 behavior: url(PIE.htc);
 -webkit-box-shadow: inset 0 8px 6px -6px #c4c4c4;  
 -moz-box-shadow: inset 0 8px 6px -6px #c4c4c4;  
 box-shadow: inset 0 8px 6px -6px #c4c4c4; 
overflow:visible;
}
.otherStyles{
background-color:#f5f5f5;
border-radius:0px;/*or other value*/
/*gradients can be placed here too.*/
}
</style>
<div class="boxShadow">
  <div class="otherStyles">
     ...content...
  </div>
</div>
于 2013-03-01T23:02:48.573 に答える