理解してほしいのは <DIV> と <SPAN> の違いである。<SPAN> は改行されないが，<DIV> は改行されると覚えておこう。これ以降はこの <DIV> を多用していくことになる。詳細については，First step CSS の <DIV> と <SPAN> や行間と字間を参照されたい。
既存の開始タグを拡張してスタイルを指定する方法を学んできたが，ある範囲に対してスタイルを指定することもできる。スタイルを適用する範囲は，文字単位である場合もあるし，パラグラフや章を一つの範囲とする場合もある。
本を読んでいて重要なところに下線を引いたり，マーカーペンでチェックすることがある。たとえば，一部の文字を緑色のマーカーペンでなぞってみよう。一部の文字の背景だけを緑色にするために，範囲と背景色を指定する。文字単位で範囲を指定するには <SPAN>，背景色を指定する属性は background-color である。
<SPAN STYLE="background-color: 色; ">...</SPAN>
色の指定方法は色名でも16進数でもかまわない。色名については First step CSS の色を変えてみるや Step forward CSS の色の指定を参照されたい。さらに，文字の背景に画像を付けるには，background-image 属性を指定し，値として url(...) のかっこ内に URL を入れて与えればよい。
<SPAN STYLE="background-color: lime;">範囲と背景色</SPAN>
文字に<SPAN STYLE="text-decoration: underline;">アンダーライン</SPAN>を引いたり，<SPAN STYLE="font-style: italic;">イタリック</SPAN>にすることもできます。
文字にアンダーラインを引いたり，イタリックにすることもできます。
アンダーラインやイタリック体にするするために，text-decoration とか font-style などとやや長い文字列を書く。<U> や <I> と書く方が簡単だと思われるかもしれないが，実際は <STYLE>...<STYLE> の中に一度だけ書けばよいのだから案ずるより生むが易し。詳しくは First step CSS の背景色や，Step forward CSS の文字の装飾を参照されたい。
IE3 background-color, background-image を指定してもうまくいかない。実は，IE3 はこの２つの属性を「知らない」。かわりに background という属性を使ってみよう。
<SPAN> が文章中の比較的短い部分に使われるのに対して，ややまとまった段落レベルの範囲指定には <DIV> を使う。以下の段落は行間を広く開けているが，行送り（line-height）が２倍（200%）に指定されている。
<DIV STYLE="font-size: 12pt; line-height: 200%;">
<P>カスケーディングスタイルシートの出現によって，Web はますます絢爛豪華になってくるような気がします。</P>
</DIV>
ちなみに，これまでの HTML では行間を変えることはできなかった。
理解してほしいのは <DIV> と <SPAN> の違いである。<SPAN> は改行されないが，<DIV> は改行されると覚えておこう。これ以降はこの <DIV> を多用していくことになる。詳細については，First step CSS の <DIV> と <SPAN> や行間と字間を参照されたい。
