HTML の 文章 の 一部だけ 文字の色を 変更する

目的

• HTMLファイルの文章の1部のみ文字の色を変更する方法をまとめる

押さえるポイント

• 変更したい文字をspanタグで囲みCSSで文字の色を設定する

書き方の例

• 下記にHTMLファイルの内容を記載する

<h1>おはよう<span>ございます</span></h1>

• CSSにて色を設定する
• 下記にCSSファイルの内容を記載する

span {
    color: カラーコード;
}

より具体的な例

h1要素の｢おはようございます。｣の｢。｣を赤色に設定する。

〜サンプルコード〜
- 下記にHTMLファイルの内容を記載する。

<h1>おはようございます<span>。</span></h1>

• CSSで上記のHTMLファイルのspanタグに対して文字を赤色に設定する。
• 下記にCSSファイルの内容を記載する。

span {
  color: red;
}