【HTMLの基本】文字色をCSSで変更する方法

f:id:Kawan0116:20180324192601j:plain

かわん(@kawan0116)です。

今回はCSSを使って文字色を変えてみようというお話。

こんな感じですね。

赤文字サイコー。強調出来るよぉ!

これ、どうやってるのかと言うと、まずはCSSで書きます。

.red {
color:red;
}

これで完成。あとは、文中で「.red」を割当ます。以下のような感じに。

<span class="red">赤文字サイコー。</span>

spanタグに「red」クラスを割り当ててるんです。

赤字にしたい箇所だけ、spanで囲みます。

あいうえお<span class="red">ここにテキスト</span>

「ここにテキスト」だけ赤字にすることが出来るんですね。

こんな感じに。

あいうえおここにテキスト

とても簡単だ(笑)

なお、class名は固有のものにして下さいね。

既にあるもので適用してしまうと、意図したところ以外でも赤字に変わってしまいますので。

注意点

CSSの編集などで意図した通りにならず、トラブルの原因になることがあります。

よって十分注意して作業をして下さい。

万が一、何か不具合が発生しても僕ではサポート出来ませんので、自己責任で作業をして下さい。

まとめ

という事で、色々と書いてみました。

文字色の変更は比較的簡単に出来ます。

今回は赤色にしていますが、設定次第で色んな色に変更することができます。

以下のサイト様でカラー見本をみることが出来るのでチェックしてみても良いかも知れません。

上でも述べましたが、色の変更は十分注意して行って下さいね。