Herausforderung:
Die gezielte Ausrichtung auf iPad-Geräte hat sich als Herausforderung erwiesen zu überlappenden Gerätebreiten mit anderen Tablets. Die Verwendung herkömmlicher CSS-Medienabfragen mit Bedingungen für die minimale/maximale Breite trennt das iPad nicht effektiv von anderen Geräten wie LG Pad und Galaxy Tab.
Lösung:
Ein Erfolg Die Lösung besteht darin, die Bedingungen für Gerätehöhe und -ausrichtung in Kombination mit der Gerätebreite zu nutzen. Die folgenden Medienabfragen isolieren Stile speziell für das iPad:
Hochformatausrichtung:
<code class="css">@media all and (device-width: 768px) and (device-height: 1024px) and (orientation: portrait) {
/* iPad Portrait styles */
}</code>Querformatausrichtung:
<code class="css">@media all and (device-width: 1024px) and (device-height: 768px) and (orientation: landscape) {
/* iPad Landscape styles */
}</code>Durch die Nutzung dieser Medienabfragen können Sie bestimmte Stile auf iPad-Geräte anwenden und gleichzeitig andere Tablets mit ähnlichen Gerätebreiten ausschließen. Um HTTP-Aufrufe zu optimieren, können Sie sie mithilfe der bereitgestellten @media-Regeln in Ihre vorhandene gemeinsame CSS-Datei integrieren.
Das obige ist der detaillierte Inhalt vonWie kann man das iPad ausschließlich mit CSS-Medienabfragen ansprechen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
