Der Farbverlauf ist ein Verlauf einer Farbe, z.B. von hell zu dunkel.
Wie kann man einen Farbverlauf mit CSS machen?
Von oben nach unten heller werdend:
/* Die alte Syntax, veraltet und mit Präfix versehen, für alte Browser */
background: –prefix-linear-gradient(top, blue, white);
/* Die neue Syntax, die von Browsern benötigt wird, die dem Standard folgen (Opera 12.1,
IE 10, Firefox 16, Chrome 26, Safari 6.1), ohne Präfix */
background: linear-gradient(to bottom, blue, white);
Von links nach rechts heller werdend:
/* Die alte Syntax, veraltet und mit Präfix versehen, für alte Browser */
background: -prefix-linear-gradient(left, blue, white);
/* Die neue Syntax, die von Browsern benötigt wird, die dem Standard folgen (Opera 12.1,
IE 10, Firefox 16, Chrome 26, Safari 6.1), ohne Präfix */
background: linear-gradient(to right, blue, white);
Von oben links nach unten rechts heller werdend:
/* Die alte Syntax, veraltet und mit Präfix versehen, für alte Browser */
background: -prefix-linear-gradient(left top, blue, white);
/* Die neue Syntax, die von Browsern benötigt wird, die dem Standard folgen (Opera 12.1,
IE 10, Firefox 16, Chrome 26, Safari 6.1), ohne Präfix */
background: linear-gradient(to bottom right, blue, white);
Von links nach rechts heller werdend mit 70 Grad Winkel:
background: linear-gradient(70deg, black, white);
Farbverlauf in einem Bild:
/* Die alte Syntax, veraltet und mit Präfix versehen, für alte Browser */
background: -prefix-linear-gradient(left, rgba(255,255,255,0),
rgba(255,255,255,1)), url(http://link-zum-bild.jpg);
/* Die neue Syntax, die von Browsern benötigt wird, die dem Standard folgen (Opera 12.1,
IE 10, Firefox 16, Chrome 26, Safari 6.1), ohne Präfix */
background: linear-gradient(to right, rgba(255,255,255,0),
rgba(255,255,255,1)), url(http://link-zum-bild.jpg);