<angle>
Übersicht
Der CSS Datentyp <angle>
steht für einen Winkel. Dieser kann positiv (rechts, im Uhrzeigersinn) oder negativ (links, gegen den Uhrzeigersinn) sein. Ein Winkel besteht immer aus einer <number>
, gefolgt von einer Einheit (deg
, grad
, rad
or turn
). Wie auch bei anderen Werten mit Einheiten darf dazwischen kein Leerschlag sein.
Für statische Elemente können mehrere Schreibweisen zum selben Ergebnis führen (bspw. 90deg
und -270deg
oder 1turn
und 4turn
), bei dynamischen Eigenschaften wie zum Beispiel transition
kann die Schreibweise jedoch eine Auswirkung auf die Animation haben.
Die folgenden Einheiten können verwendet werden:
deg
- definiert einen Winkel in Grad. Ein voller Kreis hat
360deg
. grad
- definiert einen Winkel in Gon. Ein voller Kreis hat
400grad
.Achtung: Nicht zu verwechseln mit Grad (siehedeg
). rad
- definiert einen Winkel in Radianten. Ein voller Kreis hat 2π Radianten, das entspricht etwa
6.2832rad
.1rad
entspricht 180/π Grad. turn
- definiert einen Winkel in der Anzahl Umdrehungen. Ein voller Kreis besteht aus
1turn
.
Alle Einheiten können auch den Wert 0
(oder 0deg
, 0grad
, 0rad
, 0turn
) annehmen, welcher unabhängig der Einheit immer dasselbe Ergebnis erzielt.
Beispiele
![]() |
Ein rechter Winkel (nach rechts, im Uhrzeigersinn): |
![]() |
Ein flacher Winkel: 180deg = 200grad = 0.5turn ≈ 3.1416rad |
![]() |
Ein rechter Winkel (nach links, gegen den Uhrzeigersinn): -90deg = -100grad = -0.25turn ≈ -1.5708rad |
![]() |
Ein Nullwinkel: |
Spezifikation
Spezifikation | Status | Anmerkung |
---|---|---|
CSS Values and Units Module Level 3 Die Definition von '<angle>' in dieser Spezifikation. |
Anwärter Empfehlung | Ursprüngliche Definition |
Browser Kompatibilität
BCD tables only load in the browser