Diese Übersetzung ist unvollständig. Bitte helfen Sie, diesen Artikel aus dem Englischen zu übersetzen.
Übersicht
Der Platzhalter <length> steht für eine Längenangabe. Diese besteht immer aus aus einer Zahl (<number>) und einer Maßeinheit (px, em, pc, in, mm, …); zwischen diesen Elementen darf sich kein Leerzeichen befinden.
Der Wertebereich ist abhängig von der jeweiligen CSS-Eigenschaft, teils sind nur positive Werte sinnvoll und zulässig.
Oftmals wird auch eine prozentuale Angabe (<percentage>) akzeptiert, diese gehört jedoch strenggenommen nicht zu den <length>-Werten und wird deshalb an anderer Stelle besprochen.
<length> wird von vielen Eigenschaften benutzt, zum Beispiel width, margin, padding, font-size, border-width und text-shadow.
Interpolation
<length>-Werte können für Animationen interpoliert werden. Für die Berechnung werden sie als reelle Fließkommazahlen behandelt, dabei wird immer der berechnete Wert interpoliert. Die Geschwindigkeit bzw. die Zwischenschritte hängen von der der Animation zugeordneten Zeitfunktion ab.
Einheiten
Relative Längenmaße
Relativ zur Schriftgröße
Die nachfolgenden Einheiten beziehen sich immer auf eine Eigenschaft der Schriftart des Elements, für das sie genutzt werden (Ausnahme: rem und rlh, diese beziehen sich auf das Wurzelelement, meist das <html>-Element).
em1ementspricht der ausfont-sizeberechneten Schriftgröße. Wird em zusammen mitfont-sizeselbst benutzt, entspricht1emder Schriftgröße des Elternelements.
em ist, zusammen mit Prozentwerten, das gebräuchlichste Maß, um den Fluß der Seitenelemente unabhängig von der vom Benutzer gewählten Schriftgröße einheitlich zu gewährleisten.width:15em;rem- Wie
em, bezieht sich jedoch immer auf die berechnete Schriftgröße des Wurzelelements.width:15rem; ex1exenspricht üblicherweise der Höhe des kleinen x; oftmals ist 1ex ≈ 0,5em.width:15ex;ch1chenspricht der Breite der Ziffer '0' (Null, Unicode U+0030)width:15ch;cap- Nominale Höhe der Großbuchstaben.
lh- Die aus
line-heightberechnete Zeilenhöhe. rlh- Wie lh, bezieht sich jedoch immer auf die berechnete Zeilenhöhe des Wurzelelements.
Relativ zum Viewport
Diese Werte werden vom sichtbaren Teil des Dokuments abgeleitet, dem Anzeigebereich. Sie sind also abhängig von der Fenster- bzw. Bildschirmgröße.
Innerhalb einer @page-Regel sind Viewport-Werte nicht zulässig.
vh1vhentspricht 1% der Anzeigenhöhe.vw1vwentspricht 1% Anzeigenbreite.vmin- Der kleinere der Werte
vhundvw. vmax- Der größere der Werte
vhundvw.
Absolute Längenmaße
Absolute Längenmaße stehen für ein physikalisches Maß, sofern die physischen Eigenheiten des Ausgabemediums bekannt sind. Eine der Einheiten wird als Referenz festgelegt, alle anderen werden relativ zu ihr definiert. Die Festlegung hängt vom Ausgabegerät ab, genauer: von dessen Auflösung.
Bei Geräten mit niedriger Auflösung (namentlich herkömmliche Flachbildschirme) ist die Bezugsgröße das sogenannte Referenzpixel. Die Größe des Referenzpixels ist definiert als die wahrgenommene Größe eines Pixels auf einem Bildschirm mit der Auflösung 96dpi in etwa einer Armlänge Abstand. In der Praxis wird jedoch meist das tatsächliche Bildschirmpixel des gerade angeschlossenen Bildschirms als Referenzpixel definiert.
Ein Referenzpixel entspricht 1px, alle anderen Einheiten sind bei niedrig auflösenden Geräten von px abgeleitet. 1in ist in Abhängigkeit von px als 96px festgelegt, was wiederum 72pt entspricht.
Aufgrund dieser eher ungenauen Definition können in mm, cm oder in angegebene Längen von jenen abweichen, die tatsächlich als solche gemessen werden würden – in anderen Worten: 1cm auf dem Bildschirm ist üblicherweise nur ungefähr gleich einem Zentimeter auf dem Zollstock.
Bei Geräten mit hoher Auflösung hingegen entsprechen die Einheiten mm, cm und in ihren tatsächlichen Maßen, mithin den Einheiten Millimeter, Zentimeter und Zoll. Von ihnen abhängig ist die Einheit px, sie ist definiert als 1/96 eines Zolls.
px- Pixel, abhängig vom Anzeigegerät. Auf normalen Bildschirmen entspricht
1pxeinem physischen Pixel. Bei hochauflösenden Geräten wird die Anzahl physischer Pixel so bemessen, dass 1 Zoll ungefähr 96px entspricht, also fürpxeine theoretische Auflösung von 96dpi beibehalten wird.width:150px; cm- Zentimeter
width:10cm;
mm- Millimeter
width:10mm;
in- Zoll (Englisch: Inch). 1 Zoll = 2,54cm
width:10in;
pc- Picas. 1pc = 12pt = 1/6in
width:10pc;
- pt
- Punkt, ein Wert aus dem Druckgewerbe. 1pt = 1/72in
width:10pt;
mozmm- Experimentelle Maßeinheit, die unter Berücksichtigung der Auflösung des Anzeigegeräts immer exakten Millimetern entspricht.
Spezifikationen
| Spezifikation | Status | Anmerkung |
|---|---|---|
| CSS Values and Units Module Level 3 Die Definition von '<length>' in dieser Spezifikation. |
Anwärter Empfehlung | ch, rem, vw, vh, vmin, vmax hinzugefügt |
| CSS Level 2 (Revision 1) Die Definition von '<length>' in dieser Spezifikation. |
Empfehlung | pt, pc, px definiert |
| CSS Level 1 Die Definition von '<length>' in dieser Spezifikation. |
Empfehlung |
Browserkompatibilität
| Feature | Chrome (WebKit) | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | 1 | 1.0 (1.7 oder früher) | 3.0 | 3.5 | 1.0 |
ch |
27 | 1.0 (1.7 oder früher) [1] | 9.0 | Nicht unterstützt | Nicht unterstützt |
rem |
4 (532.3) | 3.6 (1.9.2) | 9.0 | 11.6 | 4.1 |
vh, vw |
20 | 19 (19) | 9.0 | Nicht unterstützt | 6.0 |
vmin |
20 |
19 (19) | 9.0 (with the non-standard name vm) |
Nicht unterstützt | 6.0 |
vmax |
26 | 19 (19) | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt (537.30) |
Viewport-percentage lengths invalid in @page |
? | 21 (21) | ? | ? | ? |
mozmm |
Nicht unterstützt | 4.0 (2.0) | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt |
1in always is 96dpi |
(Ja) | 4.0 (2.0) | (Ja) | (Ja) | (Ja) |
| Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | (Ja) | (Ja) | (Ja) | (Ja) | (Ja) |
ch |
Nicht unterstützt | (Ja) | ? | ? | ? |
rem |
2.1 | (Ja) | ? | 12.0 | 4 |
vh, vw, vmin |
(Ja) | 19.0 (19) | ? | Nicht unterstützt | 6.0 |
vmax |
Nicht unterstützt (bug 91440) | 19.0 (19) | ? | Nicht unterstützt | Nicht unterstützt (bug 91440) |
Viewport-percentage lengths invalid in @page |
? | 21.0 (21.0) | ? | ? | ? |
[1] In Gecko 1.0-1.9.0 (Firefox 1.0-3.0) ch was the width of 'M' and it didn't work for border-width and outline-width CSS properties.