Kurzbeschreibung
CSS bietet dem Webdesigner einen sanften Übergang zwischen zwei oder auch mehr Farben herzustellen.
CSS definiert drei Typen von gradients:.
- Linear Gradients (von oben nach unten, von rechts nach links),
- Radial Gradients (werden um das Zentrum gebildet),
- Conic Gradients (rotieren um einen Mittelpunkt).
Hier einige Beispiele.
Das Beispiel zeigt eine linearen Gradienten von oben (rot) nach unten (gelb).
background-image: linear-gradient(red, yellow);
Das Beispiel zeigt eine linearen Gradienten von links nach rechts mit mehreren Farben.
background-image: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet);
Das Beispiel zeigt eine radialen Gradienten von innen nach außen mit mehreren Farben.
background-image: radial-gradient(red, yellow, blue);
Das Beispiel zeigt eine konischen Gradienten im Uhrzeigersinn mit mehreren Farben.
background-image: conic-gradient(red 45deg, yellow 90deg, blue 240deg);
