HTMLでの文字色や文字サイズ、文字フォントの指定方法【現役エンジニアが解説】

PROGRAM

今回は、HTMLでの文字色や文字サイズ、文字フォントの指定方法について、それぞれに分け、簡単に解説していきます。

文字色の指定方法

文字色を指定するには、スタイルのcolor属性を使います。

スタイルのcolor属性の値にはHTMLの6桁のカラーコードを指定します。

<span style="color:#ff0000;">赤</span>
<span style="color:#00ff00;">緑</span>
<span style="color:#0000ff;">青</span>

上記のコードでは、spanタグを使って、赤と緑、青の文字を、それぞれの文字色で表示しています。

文字サイズの指定方法

文字サイズの指定には、スタイルのfont-size属性を使用します。

スタイルのfont-size属性の値にはピクセルやパーセント単位等でサイズを指定します。

<span style="font-size:12px;">ほげ</span>

上記のコードでは、spanタグを使って、文字サイズを12ピクセルで、ほげという文字を表示しています。

文字フォントの指定方法

フォントを指定する場合は、スタイルのfont-family属性を用います。

スタイルのfont-family属性の値にはWebフォントを除きブラウザ標準対応のフォント名を指定します。

<span style="font-family:メイリオ;">ほげ</span>

上記のコードでは、spanタグを使って、メイリオのフォント(Windows向け)で、ほげという文字を表示しています。