10月 122011
 

灰色背景がサンプルソース薄緑背景が実際の見た目

サンプルソース

HTMLソース

class=”strred”が記述されたspanタグで囲んだ文字だけが<span class=”strred”>赤く</span>なる。class=”strgreen”が記述されたspanタグで囲んだ文字だけが<span class=”strgreen”>緑色に</span>なる。

CSSソース

.strred {color:red;}
.strblue {color:blue;}

サンプル表示

class=”strred”が記述されたspanタグで囲んだ文字だけが赤くなる。
class=”strblue”が記述されたspanタグで囲んだ文字だけが青になる。

解説

HTMLソース

文字の色を変えたい箇所のみspanタグでくくって、スタイルシートで設定したclassを指定します。
ここでは、<span class=”strred”>赤く</span>としています。

CSSソース

.strred {color:red;}と記述します。

これは、class=”strred”を指定したタグでくくられた箇所の文字色を赤くするという意味です。strblueの方も色が青ということ以外は同じです。

color:redのred部分、color:blueのblue部分を他の色名称やカラーコードに書き換えれば、違う色になります。

[参考]色見本 – 色名称/カラーコード一覧

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>