logo

HTMLでテキストの色を変更する方法

HTML では、次のさまざまな方法を使用してテキストの色を変更できます。

  1. HTMLタグを使用する
  2. インラインスタイル属性の使用
  3. 内部CSSの使用

1. HTMLタグの使用

注: HTML 5 はフォントの color 属性をサポートしていないため、テキストの色を変更するにはインライン スタイル属性と内部 CSS オプションを使用する必要があります。

Webページ上に表示されるHTMLタグを使用してテキストの色を変更したい場合は、以下の手順に従う必要があります。次の手順を使用すると、テキストの色を簡単に変更できます。

ステップ1: まず、任意のテキスト エディターに HTML コードを入力するか、使用するテキスト エディターで既存の HTML ファイルを開く必要があります。 HTMLタグ

C でフォーマットされた文字列
 Change the text color Using HTML tag JavaTpoint <br> Html Tutorial <br> How to Change the Text Color in Html 

ステップ2: 次に、色を変更したいテキストの先頭にカーソルを移動します。次に、空の HTML を入力します。 その位置にタグを付けます。

 Single Line text and statements 

ステップ 3: 次に、色を変更したいテキストの末尾にあるフォントタグを閉じる必要があります。

 Single Line text and statements 

ステップ 4: ここで、「」という名前のフォントタグの属性を追加する必要があります。 '。そこで、次のように入力します。 開始時の属性 鬼ごっこ。そして、テキストに使用したい色を指定する必要があります。そこで、色の名前を入力します。 色属性 次のブロックで説明します。

 Change the text color Using HTML tag JavaTpoint <br> Html Tutorial <br> How to Change the Text Color in Html 
今すぐテストしてください

ステップ5: 最後に、HTML コードをテキスト エディターに保存して、コードを実行する必要があります。実行後、ブラウザに出力が表示されます。次のスクリーンショットは、上記の HTML コードの出力を示しています。

HTMLでテキストの色を変更する方法

2. インラインスタイル属性の使用

Web ページに表示されるインライン スタイル属性を使用してテキストの色を変更したい場合は、以下の手順に従う必要があります。これらの手順を使用すると、テキストの色を簡単に変更できます。

ステップ1: まず、任意のテキスト エディターに HTML コードを入力するか、テキストの色を変更するために style 属性を使用する既存の HTML ファイルをテキスト エディターで開く必要があります。

 Change color using style attribute This page helps you to understand how to change the color of a text. And, this section helps you to understand how to change the text color using the style attribute. 

ステップ2: 次に、色を変更したいテキストの先頭にカーソルを移動します。そして、インラインで入力します スタイル 任意の要素内の属性。ここで使用するのは、

8対1マルチプレクサ

(段落) タグ:

任意のテキスト

ステップ 3: このステップでは、色の名前を値として指定する必要があります。色の名前は次の 3 つの形式で指定できます。

  1. 色の名前を入力できます
  2. 色のRGB値を入力することもできます
  3. 色の 16 進値を入力することもできます。

ステップ 4: 次に、色を変更したいテキストの末尾にある要素を閉じる必要があります。

任意のテキスト

ステップ 4: そして最後に、CSSのスタイル属性を使用してテキストの色を変更するHTMLコードを保存します。

 Change color using style attribute <p> This page helps you to understand how to change the color of a text. </p> <p> And, this section helps you to understand how to change text color using style attribute. </p> 
今すぐテストしてください

上記のコードの出力を次のスクリーンショットに示します。

HTMLでテキストの色を変更する方法

2. 内部 CSS の使用

Web ページに表示される内部カスケード スタイルシートを使用してテキストの色を変更したい場合は、以下の手順に従う必要があります。これらの手順を使用すると、テキストの色を簡単に変更できます。

ステップ1: まず、テキスト エディターに HTML コードを入力するか、内部 CSS を使用してテキストの色を変更する既存の HTML ファイルをテキスト エディターで開く必要があります。

 Change color using Internal CSS This page helps you to understand how to change the color of a text. In this Section, we used the internal CSS for changing the text color. 

ステップ2: ここで、HTML ドキュメントの head タグにカーソルを置き、タグ内にスタイルを定義する必要があります。 次のブロックに示すようにタグを追加します。そして、次のように入力します。 属性を要素セレクターに追加します。

 Body { color:orange; } p { color:green; } 

ステップ 3: ここで、色を変更したいテキストの前に、定義された要素セレクターを入力する必要があります。

Java例外処理
 Change color using Internal CSS Body { color:orange; } p { color:green; } This page helps you to understand how to change the color of a text. <p> In this Section, we used the internal CSS for changing the text color. </p> 
今すぐテストしてください

上記の HTML コードの出力を次のスクリーンショットに示します。

HTMLでテキストの色を変更する方法