HTMLでは、文字の色を変えるときには「<font color="色指定">」ってのを使ったじゃん。じゃあ、スタイルシートではどうやるんだろ。ま、今までの例でも何回も出てたから、気づいてると思うけど、 スタイルシートで文字の色を変えるには、「color : 色指定 ;」を使う。 例えば、下みたいなカンジね。

<style type="text/css">
<!--
  span.class1 { color : #993333 ; }
-->
</style>

<span class="class1"> 文字の色を赤くする </span>

HTMLだと、16進数表記（#000000）か、色名表記（black）が使われてる。スタイルシートでもその2つが一般的なのは同じだけど、他にもいろんな指定法があるんだぜ。

色の名前で指定

例えば「color : red ;」とか「color : black ;」なんて、色の名前で指定する方法があるぜ。これは分かりやすいけど、色の名前には限りがあるし、ブラウザがその色の名前を知らないかもしれないぞ。実際、HTMLの仕様書には16色だけしか載せてない。つまり、それ以外の色の名前はブラウザによっては認識出来ないかもしれないってことさ。
だから、この16色以外の色を使いたいときには色の名前じゃなくて、他の方法で色指定をしたほうがいいぞ。

カラーコード（6桁）で指定

#000000 (黒) や、#FFFFFF (白) なんて、「0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F」の16種類の英数文字と数字6桁の組み合わせで色を表現する方法のことだ。color : #000000 ; や color : #FF6060 ; のようにするぜ。

カラーコード（3桁）で指定

#000 (黒) や、#FFF (白) のように、「0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F」の16種類の英数文字と数字3桁の組み合わせで色を表現する方法。color : #000 ; や color : #00F ; のようにするぞ。
3桁と6桁の違いは、#F00 と書くと、#FF0000 と認識されるって事だ。つまり、#000 は#000000 のことで、#FFF と書くと #FFFFFF ってなるぜ。

RGB（256段階）で指定

rgb(r, g, b) と光の3原色、赤(r)・緑(g)・青(b)を0から255までの256種類の数値で指定する方法のこと。めったに見かけないな。color : rgb(256, 0, 0) ; や color : rgb(0, 128, 128) ; のようにする。

RGB（100分率）で指定

上と同じだけど、0.0% から 100.0& の数値で指定する方法のこと。めったに見かけないな。color : rgb(89.5% , 32.1% , 11.1%) ; なんて指定するぜ。

HTMLには、区切りの線を作る <hr> って要素がある。この（に限らないけど） 要素の横幅をコントロールするには、「width : 数値指定 ;」を使う。 例えば、下みたいなカンジね。

<style type="text/css">
<!--
  hr.class1 { width : 300px ; }
-->
</style>

<hr class="class1"> * 線の幅を300ピクセルに

HTMLだと、「<hr width="300">」って書くけど、スタイルシートでは「width : 300px ;」だった。この300の後ろについてる「px」って記号が大事だぜ。スタイルシートで数値を指定するときは、単位を指定するんだ。
単位は、下で紹介するけど、何種類かあって、使うときには「300px」とか「10pt」みたいに数字と単位の間にスペースを空けないで指定するぞ。

相対的な単位

px

画面のピクセル（pixels）。実際のサイズは、モニターの解像度によって変わる

%

パーセント（percentage）

em

文字「M」の幅（ems）。使ってるフォントによって変わる

ex

文字「x」の高さ（x-height）。emと同じく、使ってるフォントによって変わる

絶対的な単位

in

インチ（inches）。1インチは2.54センチ

cm

センチメートル（centimeters）

mm

ミリメートル（milimeters）

pt

ポイント（points）。1ポイントは1/72インチ

pc

パイカ（picas）。1パイカは12ポイント

で、これだけあるけど、実際には、文字のサイズを調整するときには「px」「em」「pt」、要素の縦横幅なんかを調整するときには「px」「%」がよく使われるぜ。

例えばDIV要素に背景画像を貼るには、下のようにするぞ。

div.class1 { background-image : url(back.gif) }

「url(imageurl)」のimageurlの所には、<img src="imageurl">の「src="imageurl"」と同じく、画像のパスが入るぜ。
相対指定と絶対指定のどちらも可能で、クオテーションで括ってもいいし、括らなくてもいい。下の例を参考にな。

url(../images/back.gif)
url('http://hp-design.net/title.gif')
url("http://www.geocities.co.jp/SiliconValley/4466/data/back.jpg")