CSS サンプル: @media (any-hover)

@media (any-hover: hover) と @media (any-hover: none) を使用して、:hover が使用できる環境・できない (または難しい) 環境でのスタイルを設定します。 (Edge, Chrome, Firefox, Safari。IE は別途 CSS ハック等で :hover のスタイルを指定したほうがよいと思います)

例

テスト
(PC ではカーソルを合わせてツールチップを表示させてください。スマートフォンやタブレットではツールチップがそのまま表示されます)
※ この例では IE 用 (any-hover 非対応ブラウザ) のスタイルは指定していません。

参考