1

私は次のcssコードを持っています:

     box-shadow: 0px 1px 5px #888;
    -moz-box-shadow: 0px 1px 5px #888;
    -webkit-box-shadow: 0px 1px 5px #888;

下の境界線だけが表示されるようにするにはどうすればよいですか。ぼかし半径があるため、上記のスニペットに何を変更または追加すればよいかわかりません。

4

4 に答える 4

2

ぼかし半径に基づいて拡散距離を減らします (つまり、拡散距離はぼかしの追加を補正する必要があります)。スプレッドの減少を補正するために、オフセットも調整することを忘れないでください。

box-shadow: 0px 4px 5px -3px #888;

http://jsfiddle.net/p469p/

また、必要なのはbox-shadow. Mozilla と Webkit は長い間サポートしてきました。

詳細については、下の css3 のみのドロップ シャドウを参照してください。

于 2013-03-29T20:21:46.753 に答える
0

この StackOverflow に投稿されたソリューションを確認することをお勧めします。

下のcss3のみドロップシャドウ

于 2013-03-29T20:33:21.983 に答える
0 
<!DOCTYPE html>
    <html>
        <head>
        <style> 
            div {
            box-shadow: 0px 2px #888;
            }
        </style>
        </head>
    <body>
    <div>
        The border-radius property allows you to add rounded corners to elements.
    </div>
</body>

それが唯一の方法です

于 2013-03-29T20:24:39.740 に答える