このウェブサイトはご利用の端末での閲覧に対応していません。
This website does not support your device.

メディア・クエリ~“any-hover”メディア・フィーチャーMedia Queries Level 4 で追加

記事Jan. 16th,2019
July 30th,2021
出力デバイスの入力メカニズムに要素にホバーできるものがあるかどうかを条件とするためのメディア・フィーチャー
この記事はCSS3に対応しています。
この記事はCSS3に対応しています。

any-hover”メディア・フィーチャーについて

キーワード値(“none”、“hover”)
タイプ 離散型

any-hover”メディア・フィーチャーは文書が出力されるデバイスの入力メカニズムに要素にホバーできるものがあるかどうかを表すメディア・フィーチャーです。

ホバーできる入力メカニズムがない(“none”)のはすべての入力メカニズムがホバーできない場合のみです。

指定できる値

説明
none 出力デバイスはホバーができる入力メカニズムはない
hover 出力デバイスはホバーができる入力メカニズムがある

サンプルコード

@media all and (any-hover: none) {
p.sample {
background-color: #aa4c8f; /**/
text-decoration: underline dotted;
}
}

@media all and (any-hover: hover) {
p.sample {
background-color: #595857; /**/
text-decoration: underline dashed;
}
}
<p class="sample">
夏の帽額のあざやかなる、簾の外の高欄のわたりに、いとをかしげなる猫の、赤き首綱に白き札つきて、碇の緒くひつきて引きありくもなまめいたり。
</p>

夏の帽額のあざやかなる、簾の外の高欄のわたりに、いとをかしげなる猫の、赤き首綱に白き札つきて、碇の緒くひつきて引きありくもなまめいたり。

一番上へ
トップにもどる
シェアする
シェアする
Facebookでシェアする
ツイート
Google+でシェア
Pocket
はてなブックマーク