CSSのhoverと擬似クラスに関して

本記事は、
上記のような方に向けて記事を書いています。

こんにちは、トモジです。

私はプログラミング未経験から独学で勉強して、
簡易的な動的サイト・ゲーム・サービスが作れる状態になりました。

本記事は、hoverと擬似クラスに関して要点をわかりやすく説明しております。

CSSのhoverと擬似クラスに関して

hoverとは、カーソルを対象物に合わせた時に変化させる事を言いhoverも擬似クラスの一つです。

そして擬似クラスとは、指定の要素が特定の状態である場合にスタイルを適用させるセレクタです。
文章構造の範囲外にある情報によってスタイルを変化させることができます。

わからない単語が多く出てきたかと思いますので、まず単語の意味について説明をしていきます。

セレクタ

セレクタとは、CSS装飾を適用させたいHTML要素を指定するためのもので、
HTML要素以外にセレクタにはクラスやIDを設定する事ができます。

クラスセレクタは[ . ] + [ セレクタ名 ]
idセレクタは[ # ] + [ セレクタ名 ]

擬似クラス

擬似クラスとはセレクタに付加するキーワードであり、選択された要素に対して特定の状態を指定します。
非常に様々な擬似クラスが存在しますが、今回は使用頻度が高いものを抜粋して説明していきます。

擬似要素

補足で擬似要素についても説明しておきます。
擬似要素とは、文章の１文字目・１行目など要素の一部に対して影響を与える事ができるます。

[擬似クラス]
指定したもの全体に影響を与えるもの

[擬似要素]
要素の一部に対して影響を与えるもの

まとめ

今回はCSSのhoverと擬似クラスに関しての説明をしました。