# Farbverlauf • Praxislexikon

Farbverlauf

Definition
machen
verwenden

Was ist ein Farbverlauf?

  • 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);
  •  

Wofür kann man einen Farbverlauf verwenden?

PHP Code Snippets Powered By : XYZScripts.com

  

Immunsystem stärken
Immunsystem stärken. Deine Verteidigung.
Schlafen, Essen, Bewegung, kein Stress, Liebe, Vorbeugung