日文文書処理

ここでは、要素の中のテキスト全体ではなく、要素の中のテキストの一部の表示を変更する方法を学ぶ。

テキストの一部をグループ化する

例えば、スタイルシートを使って〈見出し要素〉にスタイルを指定すれば、テキストの表示を変更することができる（→見出し要素の表示を変更する）。しかし、その場合は、要素のテキストの表示がすべて変更されてしまう。

ある要素の中のテキストの一部の表示を変更するには、要素の中のテキストの一部をグループ化する必要がある。要素の中のテキストの一部をグループ化するには「span要素」を用いる。

〈span要素〉について

〈span要素〉はインライン要素で、〈段落要素〉などのブロックレベル要素の一部をグループ化するものである。

〈span要素〉は次のように記述する。

<p>テキストの一部分だけを<span>赤色にします</span>。</p>

クラス属性を記述する

〈span要素〉は、それだけでは意味を持たない。一般に、《クラス属性》class attributeや《id属性》id attributeと組み合わせて使われる。たとえば、〈span要素〉に《クラス属性》を指定すると、次のようになる。

<p>テキストの一部分だけを<span class="red">赤色にします</span>。</p>

〈span要素〉の《クラス属性》に対して、スタイルシートstyle sheetでスタイルを指定すれば、要素の中のテキストの一部の表示を変更することができる。たとえば、スタイルシートに

span.red {
    color: red ;}

のように書けば、文字色が赤色になる。