webdevqa.jp.net

IE7およびIE8のボックスシャドウ

IE7およびIE8でボックスシャドウを実装したい。私は成功せずにすべてを試しました。以下は、色付きの影をdivに適用するために使用しているcssです。

.bright{
    position: absolute;
    z-index: 1; 
    -moz-box-shadow: 0px -3px 55px 20px #147197;
    box-shadow: 0px -3px 55px 20px #147197;
    -webkit-box-shadow: 0px -3px 55px 20px #147197;
    behavior: url(ie-css3.htc);
}

このie-css3.htcファイルは、IEシャドウの問題の解決策です。ただし、カラーシャドウではなく、黒いシャドウのみを提供します。

filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=100, Strength=13);

しかし、それは指向性の影を作成し、全方向性の影が欲しいです。ぼかしフィルターも試しましたが、現在のケースではお勧めできない追加のdivが必要です。この問題に関する専門家の意見はありますか?

24
Shades88

IEの古いバージョンで CSS3プロパティ をエミュレートする CSS3 PIE を使用します。

box-shadow除くinsetキーワード)。

45
thirtydot

iE8ではあなたが試すことができます

-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#c0c0c0')";
 filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=135, Color='#c0c0c0');

注意:IE8では、何らかの理由で滑らかなフォントを失うと、ギザギザに見えるでしょう

5
iamari

これを試すことができます

box-shadow:
progid:DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=10, Color='#19000000'), 
progid:DXImageTransform.Microsoft.dropshadow(OffX=10, OffY=20, Color='#19000000'), 
progid:DXImageTransform.Microsoft.dropshadow(OffX=20, OffY=30, Color='#19000000'), 
progid:DXImageTransform.Microsoft.dropshadow(OffX=30, OffY=40, Color='#19000000');
2
user2795385

シャドウボックスの問題を修正するためにこれを使用します

filter: progid:DXImageTransform.Microsoft.dropShadow (OffX='2', OffY='2', Color='#F13434', Positive='true');
0
Kumar vaibhav