にしし ふぁくとりー(西村文宏 個人サイト)

Presented by Nishishi via Movable Type. Last Updated: 2015/09/22. 13:23:34.

hover疑似クラスか :hover疑似クラスか

スタイルシートには「疑似クラス」と呼ばれるモノがあります。たぶん最も頻繁に使われているのはhover疑似クラスでしょう。a要素のhover疑似クラスを使えば、リンクの上にマウスが乗っかったときにだけ、動的に装飾を変化させられます。hover疑似クラスは何もa要素(リンク)に限定したものではなく、スタイルシートの仕様的にはあらゆる要素に指定可能です。実際、Firefoxなどの最近のMozillaブラウザやOperaでは、a要素以外にhover疑似クラスを指定しても、ちゃんと機能します。

とまあ、そんな記事をAll Aboutで先週あたりに公開しました。つい先日もネタにしたけど。 → 「マウスが乗った行だけ装飾を変化させる

で、本題はそこではなく。疑似クラスの表記の仕方。
a要素にhover疑似クラスを使う場合、スタイルシートのソース上の記述は、次のような感じになります。

a:hover { 装飾 }

要素名のあとにコロン「:」を1つ打って、その後に疑似クラス名を書きます。だから「a:hover」となるわけです。
で、ここでのコロン「:」記号は、要素名と疑似クラス名を分ける記号なので、別に疑似クラス名の一部ではないと思うのですよね…。だから、「hover疑似クラス」というような書き方がいいのかなーと思ったりして、先日の記事中では「hover疑似クラス」と表記したのですけど、(私も昔よく表記してたんですが)「:hover疑似クラス」という表記もよく使われるんですよね。プロポーショナルフォントの場合、あんまり違いは分からないかも知れませんが(^^;)、先頭にコロンを付けて「 :hover疑似クラス 」と書いてます。

これ、どっちがいいのかな…。
コロンは疑似クラス名の一部ではないわけだから付けなくていいとは思うんだけど、「疑似クラス名は要素名の後にコロンを打つ」のは必要なことだから、「 :hover 」だと覚えてしまった方が間違えない…とかいう理由もあるかも知れない。^^;;;

どうなんだろうねえ。

===(追記 18:45)===
コメントで指摘を頂きました。どうやらCSSの仕様書でもコロンは付加しているようです…。ひゃー。^^;;; コロンは付けるのが正式な呼び方っぽいですね…!!!
(※↓コメント欄参照)

コメント

Cascading Style Sheets, level 2の仕様書では、「:boo擬似クラス」と呼んでますね。
http://www.w3.org/TR/REC-CSS2/selector.html#q15
http://www.y-adagio.com/public/standards/tr_css2/selector.html#q15

投稿者 通りすがり : 2006年05月25日 17:45

ぐおおおおおおおおおおおおおおおっ。
通りすがりさん、どうもです。

ええええっ!?
もしかして、コロン加える方が正しい呼び方…!?^^;;;
そうなのかっ!?

衝撃だ…。^^;;;

投稿者 にしし : 2006年05月25日 18:42

コメント数: 2件

コメント投稿欄 この日記に対するコメント投稿を歓迎します。

保存しますか?



※本文中にURLは書けません。(書くと投稿が拒否されますのでご注意下さい。)

※投稿内容は、実際にページ上に掲載される前に、管理者によって確認される設定にしている場合があります。その場合は、投稿後にその旨が表示されます。たいてい1~2日以内には表示されるはずですので、気長にお待ち願います。m(_ _)m

トラックバック

このエントリーへのトラックバックURLを表示するにはここをクリック
※スパム防止のため、トラックバックURLは別ウインドウで表示します。(JavaScriptが有効でないと表示されません。)

--- 当サイト内を検索 ---