文書の装飾を class を使って指定します。
<p>福山市立城北中学校</p>
この文書に装飾を施します。
① 文字色を赤くする
福山市立城北中学校
<p class="red">福山市立城北中学校</p>
② 文字色を青くする
福山市立城北中学校
<p class="blue">福山市立城北中学校</p>
③ 文字色を緑にする
福山市立城北中学校
<p class="green">福山市立城北中学校</p>
④ 文字サイズを少し大きくする
福山市立城北中学校
<p class="big">福山市立城北中学校</p>
⑤ 文字を太字にする
福山市立城北中学校
<p class="bold">福山市立城北中学校</p>
⑥ アンダーラインを引く
福山市立城北中学校
<p class="underline">福山市立城北中学校</p>
⑦ 文書をセンタリングする
福山市立城北中学校
<p class="center">福山市立城北中学校</p>
⑧ 文書を右寄せする
福山市立城北中学校
<p class="right">福山市立城北中学校</p>
⑨ ①~⑧を合せて指定することもできます。例えば緑色で,少し大きな文字で,太字で,センタリングし,アンダーラインを引く場合。
福山市立城北中学校
<p class="green big bold center underline">福山市立城北中学校</p>
⑪ 文書の一部分を装飾する場合。装飾する部分を<span>と</span>で囲って指定します。
福山市立城北中学校
<p>福山市立<span class="blue big bold">城北</span>中学校</p>
⑫ ページタイトル用に特別に用意された装飾
福山市立城北中学校
<p class="large">福山市立城北中学校</p>