文字の色を変える

<span style>で部分的にフォントの色を変えることができます

文章の途中で文字色を変えたい時には?
文章の途中で<span style="color:">文字色を変えたい</span>時には?
上記のようにhtmlを記述します。

変えるところ→黄色の部分 (カラーコード #cc3300 というようにRGB値を指定するものか、カラーネーム red、 black、 などを入れます。)、

具体的には ↓↓
文章の途中で<span style="color:#cc3300">文字色を変えたい</font>時には?

文章の途中で<span style="color:red">文字色を変えたい</font>時には?
上記のソース コピーして使用して下さい


カラーチャートはこちらを参照


スタイルシートに設定

例えば、orangeというクラス名で属性を記述し、あらかじめスタイルシートに設定しておくと、文字色を変える文字に背景をつけるなどが簡単にできます。(.orangeは任意のクラス名です)

<head>と</head>の間に下記のように記述します。
htmlでspanに囲まれた部分がスタイルシートで設定した色に変わります。
<style type="text/css">
<!--
.orange {color:#ffcc99;}
-->
</style>
html
文の途中で<span class="orange">文字色</span>を変える。
実際のウェブ上での見え方です。
文の途中で文字色を変える。


背景色もつけてみる
<style type="text/css">
<!--
.orange {color:#ffcc99;}
.violet {background-color:#6633cc; color:#ffffff;}
-->
</style>
html
ホームページ作成は<span class="orange">簡単</span>!スタイルシートでデザインが <span class="violet">自由自在</span>です。
実際のウェブ上での見え方です。
ホームページ作成は簡単!スタイルシートでデザインが自由自在です。

ページ全体の文字の色を指定する
◆<head>と</head>の間に下記のように記述します。ページ全体の文字色の設定です。
<style type="text/css">
<!--
body {color: #cc3300;
}
-->
</style>


ホームページを作成する際にフォントサイズを指定しなかった場合はブラウザのデフォルトサイズで表示されます。
デフォルトというのは、あらかじめパソコンに組み込まれている設定値のことで「初期設定」のようなものです。

最初にページ全体の文字サイズを指定しても、文章の途中で、 個別に文字の色を変えられます。全体指定よりも個別指定が優先します。


関連項目・関連ページ
<div>と<span>の違い コメント(メモ) 見出しをつける 段落をつける 位置を決める



●当サイトのソースは、IE6.0+のみ動作確認をしております。 それ以外のブラウザでは同じように表示されない場合がございます。ご了承下さい。


★skip ページtop



テキスト・フォント

フォント・文字

ページ全般

カラーコード表




ホームページを小粋に
css
java
home