CSS 文字(テキスト)の色を変更する
CSSで文字(テキスト)の色を変更する方法を紹介します。
以下のように、color: 色;の形式で指定します。
<div>
<span style="color: red;">テキスト</span>
</div>
<div>
<span style="color: blue;">テキスト2</span>
</div>
<div>
<span style="color: #336699;">テキスト3</span>
</div>文字の色はredやblueのようにすでに定義された色かもしくは、色コードで指定します。
色コードとは#AB3F7Cのように、先頭の#のあとに16進数の文字を6桁指定します。
先頭から2文字が赤、真ん中の2文字が緑、末尾の2文字が青の値に対応しています。
赤緑青をそれぞれ00(暗)〜FF(明)の値で指定します。
<div>
<span style="color: #000000;">テキスト</span>
</div>
<div>
<span style="color: #FF0000;">テキスト2</span>
</div>
<div>
<span style="color: #00FF00;">テキスト3</span>
</div>
<div>
<span style="color: #0000FF;">テキスト4</span>
</div>
<div>
<span style="color: #FF00FF;">テキスト5</span>
</div>
<div>
<span style="color: #FFFF00;">テキスト6</span>
</div>#334455のように、赤緑青のそれぞれの値の1桁目と2桁目が同じ場合は#345のように省略することも可能です。
<div>
<span style="color: #9900FF;">テキスト</span>
</div>
<div>
<span style="color: #90F;">テキスト2</span>
</div>