CSS は、同様の画面サイズを持つ他のデバイスを除外して、iOS デバイスを具体的にターゲットにすることができますか?

CSS メディア クエリを使用した iOS デバイスのターゲット

Q: CSS を使用して、他のデバイスを除外しながら iOS デバイスを特にターゲットにすることは可能ですか?同様の画面を備えたデバイスサイズ?

A: はい、@media クエリと @supports ルールを組み合わせてこれを実現できます:

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

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

このアプローチは機能しますiOS デバイスで使用される Web ブラウザである Safari Mobile だけが -webkit-touch-callout をサポートしているためです。 property.

追加の考慮事項:

• @supports は Internet Explorer ではサポートされていないため、そのブラウザを使用しているデバイスでは動作しない可能性があります。
• iOS 上の Chrome と Firefox は WebKit レンダリング エンジンを使用し、上記のコードがすべての iOS で確実に動作するようにします。
• Apple は将来の iOS リリースで -webkit-touch-callout のサポートを削除する可能性があることに注意することが重要です。
• サポートされているリストにリストされているように、特定の iOS プロパティをターゲットにするための代替オプションが利用可能です。 CSS プロパティ ページ。

以上がCSS は、同様の画面サイズを持つ他のデバイスを除外して、iOS デバイスを具体的にターゲットにすることができますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。