11

私はこの問題について髪を引き裂いてきました。上部以外に、要素全体を囲む単純な影が必要です。Firefox と Chrome で問題なく動作するようになりました。しかし、IE にはこの奇妙な「方向」設定があり、他の 4 つの数字で影を定義します。

上部以外の要素全体に影が付くように、適切な CSS を定義するのを誰かが手伝ってくれますか?

/* For Firefox and Chrome */
-moz-box-shadow: 0px 0px 7px #000;
-webkit-box-shadow: 0px 0px 7px #000;
 box-shadow: 0px 0px 7px #000;

 /* for IE */
 -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=600, Color='#000000')";
4

4 に答える 4

8

上記の回答に似ています（以下の注を参照）：

#boxContainer{ 
   filter:
        progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=0, Color='#000000'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=90, Color='#000000'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=180, Color='#000000'),
        progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=270, Color='#000000');
}

重要: IE にもバグがあり、同じスタイルが子要素に適用されることに注意してください。そのため、必要に応じて「カウンター」/「無効化」を適用する必要がある場合があります。

例：

#boxContainer button, #boxContainer div, #boxContainer span {
  /* Nullify Inherited Effect - Set "Strength=0" */
  filter:
    progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=0, Color='#000000'),
    progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=90, Color='#000000'),
    progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=180, Color='#000000'),
    progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=270, Color='#000000');
}
于 2012-10-02T05:14:11.907 に答える
5

代わりに「グロー」フィルターを試してください。

http://msdn.microsoft.com/en-us/library/ms532995(v=VS.85).aspx

 DIV.aFilter {
    filter:progid:DXImageTransform.Microsoft.Glow(Color=blue,Strength=5);
    width: 150px;}
于 2011-10-20T19:17:18.927 に答える
0

ここに解決策があります： http://www.artlebedev.com/tools/technogrette/html/filters-in-ie/ 上記のページのコードサンプルの1つを引用するために、大幅に良く見えるグローフィルターとブラーフィルターを組み合わせます：

.shadowed .shadow-3
{
filter: progid:DXImageTransform.Microsoft.Glow(Color=#000000,Strength=1.0)
progid:DXImageTransform.Microsoft.Alpha(opacity=25)
progid:DXImageTransform.Microsoft.Blur(pixelradius=1.75, enabled='true');
-ms-filter: "progid:DXImageTransform.Microsoft.Glow(Color=#000000,Strength=1.0)"
"progid:DXImageTransform.Microsoft.Alpha(opacity=25)"
"progid:DXImageTransform.Microsoft.Blur(pixelradius=1.75, enabled='true')";
color: #111111;
top: -2px;
left: -2px;
}
于 2016-08-11T11:48:30.677 に答える