css - CSS 線形グラデーションの垂直方向の配置

Question

これが実際の例です：

http://jsfiddle.net/nnrgu/1/

ここで、background-position:0px -70px に変更して、何が起こっているかを確認します。

http://jsfiddle.net/nnrgu/2/

線形勾配、なくなった！

私はそれを間違っていますか、それともこのように動作するはずですか? 線形グラデーションを背景画像と一緒に移動する方法、または線形グラデーションを移動できないようにする方法は?

ありがとう。

Answer 1

background-position: 0 -70px, 0 0;

トリックを行います。複数の background-images をコンマ区切りで宣言するので、イメージごとに 1 つの位置をカンマ区切りで宣言できます。

http://jsfiddle.net/nnrgu/3/

私は省略形を好む：

background: <color> image1 position1 repeat1 attachment1, image2 position2 repeat2 attachment2, ... ;

このようにして、どの位置/繰り返しがどの画像に属しているかが明確になり、文字が少なくなります。

_{補足:0値として持っている場合は、単位を省略してください。}