[解決済み】タッチデバイスで:hoverのCSSスタイルを削除/無視する方法

質問

をすべて無視したい。 :hover ユーザーがタッチデバイスで当社のウェブサイトにアクセスした場合、CSS 宣言が適用されます。なぜなら :hover タブレットがクリックやタップをしたときにこのCSSを適用すると、要素のフォーカスが失われるまで、このCSSが固定される可能性があるため、邪魔になることさえあります。正直なところ、なぜタッチデバイスで :hover しかし、これが現実であり、この問題もまた現実なのです。

a:hover {
  color:blue;
  border-color:green;
  /* etc. > ignore all at once for touch devices */
}

では、（どのように）すべてのCSSを削除/無視することができるのでしょうか？ :hover を宣言させた後、タッチデバイス用に（1つ1つ知らなくても）一度に宣言させることができますか？

どのように解決するのですか？

2020年の解決策 - CSSのみ - Javascriptなし

使用方法 メディアホバー と共に メディアポインタ をクリックすると、この問題を解決できます。クロームウェブとアンドロイドモバイルでテストしています。私はこの古い質問を知っていたが、私はこのような解決策を見つけられませんでした。

@media (hover: hover) and (pointer: fine) {
  a:hover { color: red; }
}

<a href="#" >Some Link</a>