Wit Mania(Webデザイン:::The Principle of CSS basis):::

The Principle of text decoration

CSSによる文字装飾

CSSでデザインする文字装飾の基本

CSSデザインを始めるためには、各プロパティの効果を理解しておかなければならない。ここでは、CSSを使って文字まわりを制限するプロパティを紹介していこう。基本だが、重要なポイントだ。

文字の色を変更するのはCSSデザインの第一歩

CSSを使って文字の色を変えるのは、CSSデザインの基本といえる。文字の色を変更するには、テキストを含む要素に対してcolorプロパティで色の値を指定する。値は16進数のRGB値や色の名前、10進数のRGB値、RGBのパーセンテージなどを使って指定できるが、一般的には16進数のRGB値で指定することが多く、「#RRGGBB」というような形で記述する。もし値がゾロ目の場合は桁を省略して「#RGB」という書き方も可能だ。

タイトル部分の「色を変更する」の文字を赤色に変更した例

h2要素の「色を変更する」の部分のみspan要素でマークアップしている

colorプロパティに「#ff0000」を指定して、span要素のテキストを赤色に変更する

また、色の名前で指定するときはHTMLで定義された16進数の色から選択する。10進数のRGB値やRGBのパーセンテージ指定を使うことは少ないが、「rgb(Rの値,Gの値,Bの値)」という形で指定しよう。パーセンテージは単位が必須なので注意が必要だ。

aqua black blue fuchsia
gray green lime maroon
navy olive purple red
silver yellow orange indigo
色名での指定

Copyright© 1998-2007. Wit Mania, all Rights Reserved. /// Last Update: 2010-11-16