3桁のコードでカラー指定

スタイルシートでは、3桁のコードを使ってカラー指定することが可能です。
カテゴリ
SEO対策とユーザビリティ向上
SEO対策とユーザビリティ向上/一覧 (32)


SEO基礎講座


2005年6月
     
20
   

新着エントリ
Google AdSense リンクが斜体文字 (2/25)
Google AdSense「Ads by G」 (2/17)
「まだ違反している」 Google AdSense チームからの返信 (1/28)
1日に1回しか入力されないユニークキーワードは63%(ヤフー) (1/28)
やっと Google AdSense チームに返信できました (1/27)
Google AdSense チーム に返信したらエラー (1/25)
Googleの プログラムポリシーに違反していた (1/24)
「検索結果のページからページ 1 件を削除しました」という Google のメッセージ (1/16)
Googlewashing (11/28)
Google PageRank を確認できるツール (11/27)
検索キーワードランキングレポート (6/23)
「Yahoo!Japan に登録された」とは? (6/22)
YST(Yahoo Search Technology) (6/21)
3桁のコードでカラー指定 (6/20)
margin(マージン)、padding(パディング) (6/18)
Googleの「もしかして」は固有名詞にも対応している (6/17)
必ずしも正確なキーワードで検索されるわけではない (6/16)
H1タグのフォントサイズとマージン変更 (6/16)
SERP(検索結果ページ) (6/15)
検索サービス Ask.jp の検索エンジン Teoma(テオマ) (6/14)
グーグル・アドセンスとグーグル・アドワーズ (6/13)
ブロック要素とインライン要素 (5/12)
P4P(検索結果連動型広告) (4/10)
ホスト pool-**-**-**-**.phil.east.verizon.net (3/8)
ホスト ***.yst.corp.yahoo.com (3/7)
ページ外要因を上げるためのトラックバックについて (2/1)
スニペット (1/26)
クラスタリング (1/25)
パーシャルインデックス (12/18)

新着トラックバック/コメント

リンク集


アーカイブ
2004年 (4)
10月 (2)
11月 (1)
12月 (1)
2005年 (20)
1月 (2)
2月 (1)
3月 (2)
4月 (1)
5月 (1)
6月 (11)
11月 (2)
2006年 (6)
1月 (6)
2007年 (2)
2月 (2)


アクセスカウンタ
今日:19
昨日:63
累計:263,846


RSS/Powered by 「のブログ

[PR]



2005年06月20日(Mon)
< H1タグのフォントサイズ... < margin(マージン)、padd... | スタイルシート/一覧 |  
3桁のコードでカラー指定

HTML言語では、例えば文字の色を指定する場合には、
<font color="#ff0000;">あいうえお</font>
 → あいうえお
のように、#(シャープ)から始まる6桁のカラーコードを指定します。

将来無くなる方向の <font> タグを使わずに、<span>タグを使ってスタイルシートで指定する記述は下記のようになります。
<span style="color:#ff0000;">あいうえお</span>
 → あいうえお

さて、スタイルシートでのカラー指定は、HTML言語と同様に6桁のカラーコードを使用することが可能ですが、実はスタイルシートには独自の指定方法として、3桁のカラーコードによる指定が可能です。
例えば下記のように指定します。(表示内容は先に示した例と同じ)
<span style="color:#f00;">あいうえお</span>
 → あいうえお

3桁のコードは、1桁目が、2桁目が、3桁目がという順番で並んでおり、この光の3原色を0〜fまでの16進数の値を指定して調節します。
0に近いほどその色は弱くなり、fに近いほどその色が強調されます。
ちなみに、 オールゼロ(#000)は黒、オールf(#fff)は白になります。

また、カラーは3桁の16進数の値による指定方法以外に、「0〜255の値による指定方法」と「%(パーセント)指定による方法」も用意されています。

記述例
<span style="color:rgb(255,0,0);">あいうえお</span>
 → あいうえお

<span style="color:rgb(100%,0%,0%);">あいうえお</span>
 → あいうえお