Dégradé d'arrière-plan CSS avec décalage

Question

J'ai appliqué un dégradé comme image de fond à mon corps. Puis j'ai ajouté un décalage de 255px en haut en utilisant background-position:0 255px; .

C'est très bien, à l'exception d'un petit problème : bien sûr, le dégradé ne se termine pas en bas de la page, mais 255px en dessous.

Existe-t-il un moyen simple de faire en sorte que le dégradé se termine en bas mais commence avec un décalage de à ?

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

Answer 1

Vous pouvez obtenir ce que vous voulez comme ça : Placez votre arrière-plan à 0px 0px et définissez un gradient avec plus d'arrêts de couleur, avec une zone de couleur solide en haut et ensuite le gradient réel, comme ceci :

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). */
);  

(L'exemple de code fonctionne sur le dernier ve

S s .