0

私は、最新のすべてのブラウザー (IE バージョン 9 を除く) で同じ影を取得しようとしています。残念ながら、たとえば Google Chrome は Firefox ほどうまくぼかすことができません。

これが私のコードです..

HTML:

<div id="box">Every browser should see my shadow the same way!</div>

CSS:

#box {
    box-shadow: 0 4px 4px -4px #000, 4px 0 0 0 #E8EBEF;
    padding: 10px;
    background-color: #E8EBEF;
    width: 200px;
}

ここにフィドルがあります： http://jsfiddle.net/hLp8J/1/

少なくとも最新バージョンの Firefox、Google Chrome、Safari、および Opera で同じシャドウを取得するにはどうすればよいですか? アイデアをありがとう！

4

2 に答える 2

1

レンダリングエンジンが異なれば、シャドウの描画も少し異なります（たとえば、FirefoxはWebkitベースのブラウザよりもスムーズにフォールオフします。私に言わせれば、見栄えが良くなります）

ブラウザ間で同じように見えることを保証する唯一の方法は、それについて馬鹿にして画像を使用することです。

それ以外の場合は、設計に悪影響を与えることなく、小さな違いに対処する方法を見つける必要があります。

于 2012-09-06T08:09:18.003 に答える
1

オンラインのCSS3 GeneratorまたはCSS3 Box Shadow GeneratorまたはCSS3 Makerを試すことができます

于 2012-09-06T10:09:33.290 に答える