CSS @media Handheld-Unterstützung auf iPhone- und Android-Browsern

Entwickler versuchen möglicherweise, Webseiten für mobile Browser anzupassen CSS @media Handheld-Abfragen, um das Erscheinungsbild der Seite zu ändern. Einige Plattformen, wie etwa das iPhone über Safari, ignorieren diesen Ansatz jedoch.

Alternativer Ansatz für iPhone und Android

Um diese Einschränkung zu beheben, besteht die empfohlene Lösung darin Verwenden Sie Medienabfragen, die bestimmte Geräteeigenschaften angeben. Der folgende Code veranschaulicht die Ausrichtung auf das iPhone (oder ein beliebiges Gerät mit einer Bildschirmbreite von 480 Pixel oder weniger):

Ausrichtung auf Geräte mit höherer Auflösungen

Wie bereits erwähnt, haben Geräte wie das Droid X höhere Auflösungen, die von der oben genannten Abfrage möglicherweise nicht erkannt werden. Um auf solche Geräte abzuzielen, können Medienabfragen die physischen Eigenschaften des Geräts untersuchen, wie z. B. die Auflösung:

Zusätzlich Ressourcen

Weitere Einblicke finden Sie in den bereitgestellten A List Apart-Artikeln und der W3-Empfehlung für Medienanfragen.