プロが教えるわが家の防犯対策術!

ドロップシャドウの画像分割について

質問させて頂きます。
中のコンテンツによってサイズが変わらないボックスに、ドロップシャドウをつける場合

1:一枚の背景
2:「上部、縦シャドウ(繰り返し)、下部」(または横)と分化する
3:CSSのみでドロップシャドウを表示する

という選択肢があるとおもいますが、3は実際のサイトでは見たことがなく
さまざまなサイトでボックスの「背景を表示」してみると1と2が混在していました。

ボックスのサイズが変わるのであれば、画像を分割する必要があると思いますが
画像の転送量を減らすほかに、メリットやデメリットがあるのでしょうか?
また、CSSのみで表示することは実用に耐えられるものでしょうか?

わかり辛い質問で申し訳ありませんが、助言を頂ければ幸いです。

A 回答 (2件)

CSSでのドロップシャドウは、ブラウザごとに対応が異なり、特に古いバージョンのIEに対応させることが面倒だった為に画像を作成して配置するほうが簡単だったのが理由だったのではないでしょうか。

    • good
    • 0
この回答へのお礼

回答ありがとうございます。
CSSでの対応は影の濃度などが違ってしまい、やはり不完全ですね。

お礼日時:2010/09/05 15:25

3.についてはCSS3からの実装なので、


IE系ではほとんど再現されません。

ブラウザシェアで、まだIE6/7/8を使用している方は多いので、
企業向けサイトを作ってる身なので、これらを無視することはまだむずかしいです。

残る1と2ですが、
自分は殆どの場合2を使います。
中のコンテンツに寄ってサイズが変わらないボックスといっても
ブラウザによっては添付画像くらいサイズが変わるものなので、
画像の高さが絶対に足りることはありえないと思っているので…

(添付画像は上:Firefoxの標準の文字サイズ、
下:Firefoxの文字サイズ変更で可能な限り文字サイズを上げてみたもの)
「ドロップシャドウの画像分割について」の回答画像2
    • good
    • 0
この回答へのお礼

画像まで添付して頂いて、非常にわかりやすかったです。
諸事情によりIEをメインとしたページなので、2番で作ろうと思います

ありがとうございました!

お礼日時:2010/09/05 15:29

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!