2006年5月25日(木) 14時35分45秒 [Web関連]

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

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

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

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

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

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

どうなんだろうねえ。

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