2012-02-02 23 views
1

私は、他の目的で使用したいトップ80pxのイメージと、残りのイメージをフルページの背景イメージとして設定したいと思います。CSSスプライトフルページ背景:背景位置

私が設定してみました:

background-position: 0px -80px 

が、それは動作しません。

CSSスプライト(背景位置)とフルページの背景イメージを正しく使用する方法はありますか?

答えて

-1

私のようなもの...体の背景として80px画像のdivの背景IMGを使用します。

body { background-image: url(background.gif) } 
#imgtop { height: 100%; width: 100%; background-image: url(80px_image.gif) } 
+0

こんにちは。私の基本的な目的は、バナー画像と背景画像を1つにまとめることです。あなたのソリューションがそれを達成しようとしているかどうかはわかりません。 1つのdivに – workwise

+0

?またはそれは1つのイメージのようにしか見えませんか? – fzninuse

+0

これは、OPが求めている画像スプライトの正反対です。 –

0

これらのどちらか(linkまたはlink)は、あなたと、対応するCSSのスプライトを生成します。 。

あなたはCSSクラスは、それに対応する領域のための使用が完了していることを一度のような:

.image1Background { 
    background-image: url("thesprite.png"), 
    left: -80px; 
    top: 0px; 
} 

.image2Background { 
    background-image: url("thesprite.png"), 
    left: 0px; 
    top: 0px; 
} 

<body class="image1Background"> 
    <div class="image2Background"> 
    </div> 
</body> 

スプライトは、一般的にクライアントにダウンロードするために必要な要求の数を減らすために小さなアイコンの多くに使用されています。