2023年10月アーカイブ

ホバー可能なデバイスのみa要素のホバースタイルを有効にする

gravity-works (2023年10月10日 15:36) | コメント(0)
通常、CSSで :hover スタイルを設定するとスマホでも有効になってしまい、
タップしたときにホバースタイルが有効になりつづけてしまう問題があります。

メディアクエリでPCサイズのみ効くようにすることもできますが、
ピクセルではなく以下のように書くことでホバー可能なデバイスのみホバーのスタイルを有効にすることができます。

@media (hover: hover) {
  a:hover {
    opacity: 0.7;
  }
}

●参考
« 2023年3月 | メインページ | アーカイブ | 2023年11月 »

検索

このアーカイブについて

このページには、2023年10月に書かれたブログ記事が新しい順に公開されています。

前のアーカイブは2023年3月です。

次のアーカイブは2023年11月です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。