「any-pointer」と「any-hover」メディアクエリ

Question

どのようにこれらの2つのオプションを使用しますか？ deskopブラウザで

：

@media(any-hover){ 
    body{ 
     color:red; 
    } 
} 
@media(any-pointer){ 
    body{ 
     color:green; 
    } 
} 

すべてのテキストが緑色です。どうして ？ タッチデバイスでテキストが緑色でdesctopブラウザが赤色であると思った。

Answer 1

デバイスにポインタをサポートする入力デバイスがあるかどうかを確認するには、Any-Pointerを使用する。あなたのデスクトップにはこのようなデバイス、つまりマウスがあります。

この条件は真で、テキストは緑色です。

デバイスがホバーをサポートしているかどうかを確認するには、任意ホバーを使用します。

したがって、両方の条件がデスクトップで機能します。スマートフォンでは動作しません。