Wie kann ich iOS-Geräte gezielt mit CSS-Medienabfragen ansprechen?

Targeting von iOS-Geräten mit CSS-Medienabfragen

Um gezielt iOS-Geräte mithilfe einer Medienabfrage anzusprechen, berücksichtigen Sie den folgenden Code:

@supports (-webkit-touch-callout: none) {
  /* CSS specific to iOS devices */ 
}

@supports not (-webkit-touch-callout: none) {
  /* CSS for other than iOS devices */ 
}

Diese Technik nutzt die Eigenschaft -webkit-touch-callout, die ausschließlich in Safari Mobile unter iOS implementiert ist. Geräte außerhalb dieses Ökosystems ignorieren diese Regeln.

Es ist jedoch wichtig zu beachten, dass die Verwendung von @supports keine potenziellen Kompatibilitätsprobleme mit dem IE mit sich bringt, da beide Regelsätze übersprungen werden. Darüber hinaus wird iOS möglicherweise die Unterstützung für diesen Mechanismus in zukünftigen Versionen einstellen.

Erwägen Sie alternativ die Erkundung anderer Optionen, die in „Unterstützte CSS-Eigenschaften“ unter „Safari unter iOS“ aufgeführt sind, um eine browserübergreifende Kompatibilität zu erreichen.

Das obige ist der detaillierte Inhalt vonWie kann ich iOS-Geräte gezielt mit CSS-Medienabfragen ansprechen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!