Derzeit arbeiten wir an einer Responsive Design-Website. Ich verwende eine Medienabfrage für die Ausrichtung verschiedener Geräte basierend auf der Breite und der Bildschirmauflösung.
Ich habe ein Szenario, in dem ich die Bildschirmauflösung verwenden wollte, um die Geräte anzusteuern, aber ich verstehe nicht, wie das funktioniert.
Ich wollte sowohl min-width als auch max-width überprüfen, wobei die Bildschirmauflösung auch von 97dpi bis zu iPad max. Auflösung 264dpi reicht. Aber das scheint nicht zu funktionieren. Wenn ich eine einzelne Auflösung min-width: 155dpi für hp geladene Tablette gibt es funktioniert. Aber minimale bis maximale Auflösung scheint nicht zu funktionieren. Könnten Sie Ihre Idee teilen?
Dafür habe ich den folgenden Code verwendet
%Vor% Die resolution
Medienabfrage hat noch keine gute Unterstützung in Webkit-Browsern damit Sie mit device-pixel-ratio
stattdessen mehr Erfolg haben.
So können wir Ihre Medienabfrage mit resolution
für die Browser, die sie verstehen (Firefox, IE9 +, Opera) und device-pixel-ratio
für alle Webkit-Inhalte (Chrome, Safari, iOS und Android) neu formulieren:
Nach älteren Messungen von Quircksmode Ссылка
%Vor%Allerdings funktioniert das nicht für neuere Tablets, denke ich, da mein Telefon 37em oder mehr hat.
Was ist mit:
%Vor%Diese MQs werden mit den voreingestellten Einstellungen im Windows 8.1 Simulator umgehen:
%Vor%Tags und Links css responsive-design media-queries