Ein linearer Farbverlauf in CSS kann mit der Eigenschaft “linear-gradient()” verwendet werden. Dies ermöglicht es, einen reibungslosen Übergang zwischen zwei oder mehr Farben entlang einer geraden Linie zu erzeugen.
Hier ist ein einfaches Beispiel:
```css
div {
background: linear-gradient(to right, red , blue);
}
```
In diesem Beispiel wäre der Hintergrund des div-Elements ein linearer Farbverlauf, der von rot auf der linken Seite zu blau auf der rechten Seite wechselt.
Die Syntax dieses linearen Farbverlaufs ist ziemlich einfach:
- “to right” ist die Richtung des Farbverlaufs.
- “red” und “blue” sind die Farben im Farbverlauf.
Sie können mehrere Farben hinzufügen, indem Sie einfach weitere Farben zur Liste hinzufügen:
```css
div {
background: linear-gradient(to right, red , yellow, green);
}
```
In diesem Fall würde der Farbverlauf von rot zu gelb und dann zu grün übergehen. Es ist auch möglich, den genauen Ort jeder Farbe im Farbverlauf anzugeben, indem ein Prozentsatz oder eine Länge hinzugefügt wird:
```css
div {
background: linear-gradient(to right, red 50%, blue 50%);
}
```
In diesem Fall würde der Übergang von rot zu blau genau in der Mitte des div-Elements stattfinden.