みなさんはHTMLの学習をしていませんか？今回の記事では文字色や背景色の使い方や注意点について紹介していきます！

無料カウンセリングに申し込む

span タグのstyle属性を使用します

文字色なら、fontタグのcolor属性、背景色ならbodyタグのbgcolor属性でも可能です。ただ、文章や段落毎のレイアウトと考えた場合に効率よく管理しやすい指定方法はspanタグを使用します。

div タグでも可能ですが、divタグはブロック要素全体の色彩や背景色を指定するのに使います。文中での重要なキーワード等、特定の文字の色彩を変更する場合、span style を使用して設定します。

「 div 」と「 span 」の違い

div はブロック要素になりますのでその前後で改行が入ってしまいます。そのため、文中の特定の文字だけという使い方はできませんが、span の場合はインライン要素のため文中のキーワードだけの色を指定することが可能です。

HTMLタグにstyle属性

スタイルシートは外部に「.cssファイル」を作成して独立させるのが一般的です。けれども、その箇所にだけスタイルを適用する場合には、htmlタグにstyle属性を指定して直接スタイルシートを記述することができます。

「独学でのプログラミング学習に苦戦していませんか？」

独学でのプログラミング学習の挫折率は9割以上と言われています。

✔プログラミングを身につけて、年収をUPさせたい
✔ITエンジニアになって、働き方を変えたい
✔生活を変えたいけど、何からやればよいか分からない

と思っているあなたへ向けて、
挫折率9割に負けない「プログラミング学習必勝法」を無料でプレゼントします！

完全無料なので、悩む前に今すぐ下のバナーをクリックして資料を読んでみてください！

＼簡単30秒／

下のバナーからLINE友だち追加をして、無料で限定資料をGET！

文字色の指定方法

span で文字の色彩を変える場合は、キーワードの前後に次のタグを入れます。

<span style=”color:#ff0000;”></span>

この例では、赤の#ff0000を指定していますが、変更したい色彩を指定します。

【HTML初心者入門】文字色や背景色を指定する方法

文字の背景色の指定方法

文字の背景色を変える場合には キーワードの前後に次のタグを入れます。

<span style=”background-color:#FFCBCB;”></span>

そうすると、タグの範囲の背景色だけを指定することができます。

RGB値

“#000000″ のような数値を RGB値 と呼びます。RGB値は、色を構成する R（赤）・G（緑）・B（青）の光の三原色それぞれに対して、16進数（0-9 と A-F）を用いて2桁の数値で表記し、それを横並びにした6桁の数値で示します。

その数値の先頭には、必ずハッシュ（#）を記載します。また、色は16進数の数値で指定する他にも、”red”, “yellow”, “blue” のように色の名前で指定する方法にカラーネームでの方法があります。

このように、HTML における色は RGB値やカラーネームで指定することができます。

サンプル

---

「プログラミング学習に苦戦しているあなたへ」

独学でのプログラミング学習の挫折率は9割以上と言われています。

✔プログラミングを身につけて、年収をUPさせたい
✔ITエンジニアになって、働き方を変えたい
✔生活を変えたいけど、何からやればよいか分からない

と思っているあなたへ向けて、
挫折率9割に負けない「プログラミング学習必勝法」を無料でプレゼントします！

完全無料なので、悩む前に今すぐ下のバナーをクリックして資料をGETしましょう！

＼簡単30秒／

下のバナーからLINE友だち追加をして、無料で限定資料をGET！

まとめ

初心者の方向けにhタグを紹介していきましたが、いかがでしたか？

hタグはWebサイトを作成する上で基本となるタグですので、しっかり基本を抑えてくださいね！