はじめに
こんにちは、@takashi_sakamotoです。
Webの仕組みとしてHTML、CSS、JavaScriptなど関連について、学んだことをメモしていきたいと思います。
CSSとは
CSS（Cascading Style Sheets、カスケーディング・スタイル・シート）の意味で、カスケーディングとは、小さく連なった滝という意味らしいです。
HTMLと一緒に使われ、HTMLがWebの構造を記載しているのに対して、CSSは構造要素のスタイルを指定するものです。Webページをいろいろ装飾するようなもんですかね。
CSSの構成
セレクタ (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 の基本]より
まとめ
CSSはHTMLと一緒に使い、スタイルを色々変えたい時に使用する
セレクタのの指定でスタイルを当てたい箇所に当てて行く
関連記事
どのようにスタイルを変えて行くかの種類を調べたい時スタイルシートリファレンス
どのようなスタイルがあるか確認CSS の基本
↧