More than 3 years have passed since last update.

CSS　での指定の仕方をメモ

Posted at 2021-04-29

はじめに

こんにちは、@takashi_sakamotoです。
Webの仕組みとしてHTML、CSS、JavaScriptなど関連について、学んだことをメモしていきたいと思います。

CSS（Cascading Style Sheets、カスケーディング・スタイル・シート）の意味で、カスケーディングとは、小さく連なった滝という意味らしいです。

HTMLと一緒に使われ、HTMLがWebの構造を記載しているのに対して、CSSは構造要素のスタイルを指定するものです。Webページをいろいろ装飾するようなもんですかね。

セレクタ (selector)、宣言 (declaration)、プロパティ (property)、プロパティ値 (property value)で構成されています。

セレクタでどこにスタイルをあてるのか、指定することができます。

セレクタ名	何を選択するか	例
要素セレクタ (時々タグまたは型セレクタと呼ばれます)	指定された型のすべての HTML 要素	p < p > を選択
ID セレクタ	ページ上の指定された ID を持つ要素。	特定のHTMLページでは、1つのIDにつき1つの要素（そしてもちろん1つの要素につき1つのID）しか許されません。
クラスセレクタ	指定されたクラスを持つページの要素 (複数のクラスインスタンスがページに表示されます)	.my-class < p class="my-class" > 及び < a class="my-class" > を選択属性セレクタ指定された属性を持つページ上の要素img[src] < img src="myimage.png" > を選択するが、< img > は選択しない
擬似クラスセレクタ	指定された要素が指定された状態にあるとき。例えば、マウスポインターが上に乗っている (ホバー) 状態。	a:hover < a > を選択するが、マウスポインターがリンク上にあるときのみ。
`[CSS の基本]より`

###関連記事