2012-07-30 16 views
10

Ist es richtig, einen Hintergrund mit Farbverlauf auf den Körper anzuwenden, von einem hellen Grauton bis zu einem Weiß von unten nach oben?CSS3 Hintergrund mit Farbverlauf

body { 
    background: -webkit-gradient(linear, bottom, top, from(#e7e7e7, to(#ffffff)); 
} 
+0

Es zeigt einfach weiß und ich die letzte Version von Chrome: O – Alex

Antwort

26

DEMO alle fähigen Browser unterstützen

body { 
    background-color: #ffffff; 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#999999)); 
    background-image: -webkit-linear-gradient(top, #ffffff, #999999); 
    background-image: -moz-linear-gradient(top, #ffffff, #999999); 
    background-image:  -o-linear-gradient(top, #ffffff, #999999); 
    background-image:   linear-gradient(to bottom, #ffffff, #999999); 
} 

CSS3 Please könnte

+0

Hallo, warum müssen Sie die Höhe auf 100% setzen? es funktioniert, in der Tat mein Browser siplay Blöcke von Farbverlauf und nicht die ganze Seite ... – Alex

+0

es zeigt Ihnen Blöcke von Farbverlauf, weil Sie einige Inhalte auf der Seite haben. Wenn es leer ist (wie im JSFIddle), dann zeigt es keine BG http://jsfiddle.net/WbHCd/1/. Ich habe es nur hinzugefügt, um zu zeigen, dass es funktioniert. –

+0

OK danke für Ihre Hilfe – Alex

1

Um Zoltan-Lösung, man könnte auch hinzufügen nützlich sein:

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#999999'); 

unterstützen älteren IE-Browser.

+0

Und dann müssen Sie sicherstellen, dass Sie den Filter für einige ältere Browser wie IE9 entfernen. – SergioL

Verwandte Themen