CSS-Werte und Einheiten

Referenz

Eigenschaften

• interpolate-size

Funktionen

• abs()
• acos()
• asin()
• atan()
• atan2()
• attr()
• calc()
• calc-size()
• clamp()
• cos()
• exp()
• hypot()
• <ident()>
• if()
• inherit()
• log()
• max()
• min()
• mod()
• pow()
• progress()
• rem()
• round()
• sibling-count()
• sibling-index()
• sign()
• sin()
• sqrt()
• tan()
• url()

Das CSS-Modul für Werte und Einheiten führt auch die Funktionen calc-mix(), crossorigin(), first-valid(), integrity(), random(), random-item(), referrerpolicy(), src(), type() und toggle() ein. Derzeit unterstützen keine Browser diese Funktionen.

Datentypen

• <angle-percentage>
• <angle>
• <animation-timeline>
• <attr-name>
• <attr-type>
• <calc-keyword> (e, pi, infinity, NaN)
• <calc-size-basis>
• <calc-sum>
• <custom-ident>
• <dashed-ident>
• <dimension>
• <easing-function>
• <first-valid()>
• <ident>
• <integer>
• <length-percentage>
• <length>
• <number>
• <percentage>
• <position>
• <ratio>
• <resolution>
• <rounding-strategy> (down, up, to-zero)
• <string>
• <syntax>
• <time-percentage>
• <time>
• <url>
• <url-modifier>
• <view-timeline-name>

Das CSS-Modul für Werte und Einheiten führt auch die Datentypen <frequency> und <frequency-percentage> ein. Derzeit unterstützen keine Browser diese Funktionen.

Einheiten

• % (Prozent)
• cap
• ch
• cm
• deg
• dpcm
• dpi
• dppx
• dvb
• dvh
• dvi
• dvmax
• dvmin
• dvw
• em
• ex
• grad
• Hz
• ic
• in
• kHz
• lh
• lvb
• lvh
• lvi
• lvmax
• lvmin
• lvw
• mm
• ms
• pc
• pt
• px
• Q
• rad
• rcap
• rch
• rem
• rex
• ric
• rlh
• s
• svb
• svh
• svi
• svmax
• svmin
• svw
• turn
• vb
• vh
• vi
• vmax
• vmin
• vw
• x

Flex-Einheiten (fr) und Container-Einheiten (cqb, cqh, cqi, cqmax, cqmin, cqw) sind in den Modulen CSS Grid-Layout und CSS-Bedingungsregeln definiert.

Einheitliche Kategorisierungen

• Absolute Längeneinheiten (cm, in, mm, pc, pt, px, Q)
• Winkeleinheiten (deg, grad, rad, turn)
• Standard-Viewport-Einheiten (vb, vh, vi, vmax, vmin, vw)
• Dynamische Viewport-Einheiten (dvb, dvh, dvi, dvmax, dvmin, dvw)
• Frequenzeinheiten (Hz, kHz)
• Großansicht-Portprozent-Einheiten (lvb, lvh, lvi, lvmax, lvmin, lvw)
• Lokale schriftart-relative Längeneinheiten (cap, ch, em, ex, ic, lh)
• Physikalische Einheiten (cm, in, mm, pc, pt, Q)
• Relative Längeneinheiten (cap, ch, em, ex, ic, lh, rem, rlh, vb, vh, vi, vmax, vmin, vw)
• Resolutionseinheiten (dpcm, dpi, dppx, x)
• Wurzel-Schriftart-relative Längeneinheiten (rcap, rch, rem, rex, ric, rlh)
• Kleinansicht-Portprozent-Einheit (svb, svh, svi, svmax, svmin, svw)
• Zeiteinheiten (ms, s)
• Viewport-Einheiten (dvh, dvw, lvh, lvw, svh, svw, vb, vh, vi, vmax, vmin, vw)
• Sehwinkel-Einheit (px)

Schlüsselkonzepte

• Advance Measure
• Geklammertes Bereichsnotation
• Komponentenwert-Kombinatoren
• CSS-weite Schlüsselwörter
• Gerätepixel
• Funktionale Notation
• Identifier
• Interpolation
• Schlüsselwort
• Mathematische Funktion
• Numerische Datentypen
• Ursprung
• Pixel
• Textuelle Datentypen
• URL
• Wertedefinitionssyntax

Leitfäden

CSS-Datentypen

Einführung in CSS-Datentypen, die typische Werte definieren, die von CSS-Eigenschaften und Funktionen akzeptiert werden.

Numerische Datentypen

Überblick über die numerischen Datentypen, einschließlich Ganzzahlen, Zahlen, Prozentsätze und Dimensionen sowie relative und absolute Dimensionen, Winkel und Zeiteinheiten.

Textuelle Datentypen

Überblick über die textuellen Datentypen, einschließlich vordefinierter Schlüsselwortwerte, globaler CSS-Schlüsselwortwerte und URLs.

CSS-Wertefunktionen

Überblick über die CSS-Anweisungen, die spezielle Datenverarbeitung oder Berechnungen aufrufen, um einen CSS-Wert für eine CSS-Eigenschaft zu erhalten.

Verwendung von CSS-Mathematikfunktionen

Die CSS-Mathematikfunktionen, die es erlauben, einen Eigenschaftswert als mathematischen Ausdruck zu schreiben.

Wertedefinitionssyntax

Das formale Grammatik, das verwendet wird, um die Menge gültiger Werte für CSS-Eigenschaften und -Funktionen zu definieren.

Verwendung typisierter Arithmetic in CSS

Eine Erklärung des Verhaltens und der Anwendungsfälle von typisierter Arithmetik in CSS.

Lernen: Werte und Einheiten

Ein Blick auf einige der am häufigsten verwendeten Wertetypen, was sie sind und wie sie funktionieren.

Verwandt

• CSS Kaskadierung und Vererbung Modul

  • initial
  • inherit
  • revert
  • revert-layer
  • unset
  • all

• CSS Grid-Layout Modul

  • <flex>
  • Flex-Einheiten (fr)

• CSS-Bedingungsregeln Modul

  • Container-Einheiten (cqb, cqh, cqi, cqmax, cqmin, cqw)

• CSS-Farben Modul

  • <color>
  • <system-color>
  • color-mix()

• CSS-Bilder Modul

  • <image>
  • <gradient>

Spezifikationen

Siehe auch

• CSS-Syntax Modul
• CSS-Selektoren Modul