CSS（スタイルシート）に関するメモ【定義編】

CSS（スタイルシート）を定義するときの書き方に関するメモ

head要素内に以下を記述する。

<style type="text/css">
<!--
#idSelector{
  property: value;
}
.classSelector{
  property: value;
}
-->
</style>

body要素内で呼び出しするときの書き方。

<div id="idSelector"></div>
<div class="classSelector"></div>

head要素内に以下を追加する。

<link href="style.css" rel="stylesheet" type="text/css">

head要素内に以下のタグを追加する。

<meta http-equiv="Content-Style-Type" content="text/css">

CSSの定義。以下は#idSelectorのボックスの中のp要素にスタイルを適用させる。

#idSelector p {
  property: value;
}

HTMLで呼び出しするとき。

<div id="idSelector">
  <p>この中だけスタイルが適応</p>
</div>
<div id="idSelectorOther">
  <p>ここには適応されない</p>
</div>

以下は#idSelectorのボックスの中のp要素の中にあるa要素に適用させる。

#idSelector p a {
  property: value;
}

セレクタをカンマ(,)で区切ってやることにより複数のセレクタに同じスタイルを適用させることができる。

div, .classSelector{
  property: value;
}
#idSelector h2, #idSelector ul {
  property: value;
}