Der <ratio> CSS Datentyp, der zur Beschreibung von Seitenverhältnissen in Media Queries verwendet wird, bezeichnet das Verhältnis zwischen zwei einheitenlosen Werten. Es ist ein strikt positiver <integer> Wert gefolgt von einem Slash ('/', Unicode U+002F SOLIDUS) und einem zweiten strikt positivem <integer>. Vor und nach dem Schrägstrich können Leerzeichen stehen.
Beispiele
| Verhältnis | Verwendung | |
|---|---|---|
 |
4/3 |
Traditionelles TV-Format im 20sten Jahrhundert. |
 |
16/9 |
Modernes Breitbild-TV-Format. |
 |
185/100 = 91/50(Nicht-Ganzzahl-Dividenden und -Divisoren sind nicht erlaubt.) |
Die häufigsten Filmformate seit den 1960ern. |
 |
239/100(Nicht-Ganzzahl-Dividenden und -Divisoren sind nicht erlaubt.) |
Das anamorphe Breitbild-Filmformat. |
Spezifikationen
| Spezifikation | Status | Kommentar |
|---|---|---|
| Media Queries Die Definition von '<ratio>' in dieser Spezifikation. |
Empfehlung | Ursprüngliche Definition |
Browser Kompatibilität
Update compatibility data on GitHub
| Desktop | Mobile | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Grundlegende Unterstützung | Chrome Vollständige Unterstützung Ja | Edge Vollständige Unterstützung Ja | Firefox Vollständige Unterstützung 3.5 | IE Vollständige Unterstützung 9 | Opera Vollständige Unterstützung 9.5 | Safari Vollständige Unterstützung Ja | WebView Android Vollständige Unterstützung Ja | Chrome Android Vollständige Unterstützung Ja | Edge Mobile Vollständige Unterstützung Ja | Firefox Android Vollständige Unterstützung Ja | Opera Android Vollständige Unterstützung Ja | Safari iOS Vollständige Unterstützung Ja | Samsung Internet Android Vollständige Unterstützung Ja |
Legende
- Vollständige Unterstützung
- Vollständige Unterstützung