ＣＳＳの記述

H1 { color : #000000 ; }

#header { color : #000000 ; }

.entry { color : #000000 ; }

と、ズラズラと並んでいるＣＳＳ。

赤文字がタグ名やid名やclass名です。

ＨＴＭＬでは　<H1>文字</H1>　や　<div id="header">文字</div>　や　<div class="entry">文字</div>　となっている部分です。

青文字が属性です。

タグの何を指定するかです。

色や背景や大きさなどなど。

緑色が値です。

タグの何をどんな風に指定するかです。

色を赤にや背景を画像にや大きさを大きくなどなど。

タグ { 属性 : 値 ; }

{ }内に属性と値を書き込むことで指定できます。

属性と値の間には「 : 」コロン。

複数指定する場合の区切りに「 ; 」セミコロン。

最後の指定のみ「 ; 」を省略できます。

一つだけの時も省略可。

H1　のようにタグにＣＳＳを指定すると　H1　タグ全てに適応されます。

<h1>文字</h1>

と、H1　で囲まれた文字への指定です。

他にも

div { color : #000000 ; }

p { color : #000000 ; }

table { color : #000000 ; }

と、タグに対して指定する事ができます。

#header　や　.entry　のようにタグにid名やclass名が付いている場合、そのタグのidやclassに適応されます。

<div id="header">文字</div>

<div class="main">

<div class="entry_header">文字</div>

<div class="entry">文字</div>

</div>

と、同じdivタグでもそれぞれ別々に指定する事ができます。

#header h1 { color : #000000 ; }

と、するとid名「header」の付いたdivタグで囲まれた中の　H1　タグのみに指定し、それ以外の H1タグには適応されません。

<div id="header">

<h1>文字</h1>

</div>

<h1>文字</h1>

この場合、１つ目の文字のみに適応され、２つ目には適応されません。

div , p { color : #000000 ; }

のように、「 , 」指定すると、divタグpタグ両方に適応されます。

時々見かける

/* 文字 */

/*-- 文字 --*/

「 /* 」と「*/」で囲まれた文字は、コメントです。

ＣＳＳ以外に余計な文字を書き込む場合使用します。

ＣＳＳ編集画面に/* */を使って説明を書き足しておけばとても解かりやすいです。

例えば

/*header部分*/

#header {

color : #ff0000 ;　/*ヘッダ文字色赤*/

background-color : #ffffff ;　/*ヘッダ背景色白*/

}