CSS Hintergrund Farbverlauf mit Offset

Question

Ich habe einen Gradienten als Hintergrundbild auf meinen Körper aufgetragen. Dann habe ich 255 px Offset oben unter background-position:0 255px; hinzugefügt.

Es sieht ziemlich gut aus außer ein kleines Problem: natürlich endet der Farbverlauf nicht am unteren Rand der Seite sondern 255px darunter.

Gibt es eine einfache Möglichkeit, den Farbverlauf am Ende enden zu lassen, aber mit einem Offset von bis beginnen?

http://jsfiddle.net/julian_weinert/ar6jC/

Answer 1

können Sie erreichen, was Sie so wollen: Zeigen Sie Hintergrund an 0px 0px und einen Farbverlauf mit mehr Farbstufen definieren, an der Spitze unifarben Fläche und dann die eigentliche Steigung, wie folgt aus:

background-position: 0px 0px; 
background-image: linear-gradient(to bottom, 
    #FFFFFF 0px,  // Have one solid white area 
    #FFFFFF 255px, // at the top (255px high). 
    #C4C7C9 255px, // Then begin the gradient at 255px 
    #FFFFFF 100%  // and end it at 100% (= body's height). 
); 

(der Beispielcode arbeitet an neuesten Versionen von Chrome und Firefox, aber es unterstützt alle gängigen Browser und Versionen ist geradlinig, die Anwendung nach dem gleichen Prinzip der Anpassung.)

Siehe auch diese short demo.