HTML5 & CSS3 (Prags)

10 Benutzeroberflächen für mobile Geräte mit Media Queries

Wir können schon seit einer ganzen Weile medienspezifische Stylesheets definieren. Aber wie Sie bei unserem Druck-Stylesheet im Abschnitt „8 Links ausdrucken mit :after und content“ gesehen haben, waren wir bisher auf den Ausgabetyp beschränkt. Mit den Media Queries^[25] von CSS3 können wir die Darstellung einer Seite sogar an die Bildschirmgröße unserer Benutzer anpassen. Webentwickler haben schon seit Jahren mit JavaScript die Bildschirmgröße ihrer Benutzer ermittelt. Aber jetzt können wir damit anfangen, das ausschließlich mit Stylesheets zu tun. Mit Media Queries können wir Folgendes ermitteln:

• Auflösung

• Ausrichtung (Hoch- oder Querformat)

• Breite und Höhe des Geräts

• Breite und Höhe des ...