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

Presented by Nishishi via Movable Type. Last Updated: 2017/06/21. 12:28:58.

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は書けません。(書くと投稿が拒否されますのでご注意下さい。)

※ご投稿頂いた内容は、掲載前に管理者が確認する設定にしている場合があります。たいていは数日以内には表示されるはずですので、気長にお待ち願います。m(_ _)m

著者紹介


にしし(西村文宏)

にししでございます。本書いたり記事書いたりしてます。あと萌えたり。著書5冊発売中です(Web製作系4冊+小説1冊)。著書や記事は「西村文宏」名義。記事は主にAll Aboutで連載。本の最新刊は2011年3月に発売されたライトノベルでございますよ。

Twitter:にしし/西村文宏
にしし/西村文宏 on facebook にしし/西村文宏 on mixi にしし/西村文宏 on Google+ フォローはお気軽に!

にしし(西村文宏)連絡先
☕ コーヒーをおごる

著書一覧と詳細

関連する記事など

※下記には、本サイト内外の関連記事などが8本くらい自動で表示されています。

にししふぁくとりー Sakura scope内限定での主要なカテゴリ

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