CSS color属性
属性の定義と使用説明
Color 属性はテキストの色を指定します。
| デフォルト値: | 指定なし |
|---|---|
| 継承: | である |
| バージョン: | CSS1 |
| JavaScript 構文: | object.style.color="#FF0000" |
ブラウザサポート
表内の数字は、そのプロパティをサポートする最初のブラウザのバージョン番号を示します。
-webkit-、-ms-、または -moz- の前にある数字は、その接頭辞付きプロパティをサポートする最初のブラウザのバージョン番号です。
| 属性 | |||||
|---|---|---|---|---|---|
| color | 1.0 | 3.0 | 1.0 | 1.0 | 3.5 |
ヒントと注釈
ヒント:適切な背景色とテキスト色の組み合わせを使用してください。これにより、テキストの読みやすさが向上します。
属性値
色の値は、以下の方法で設定できます：
| 值 | 説明 | 例 |
|---|---|---|
| 色の名前 | 色の名前（例：red、blue、brown、lightseagreenなど）。大文字と小文字は区別されません。 |
color:red; /* 红色 */ color:black; /* 黑色 */ color:gray; /* 灰色 */ color:white; /* 白色 */ color:purple; /* 紫色 */ |
| 16進数 | 16進数表記 #RRGGBB と #RGB（例: #ff0000）。"#" の後に6桁または3桁の16進文字（0-9, A-F）が続きます。 |
#f03 #F03 #FF0033 #FF0033 rgb(255,0,51) rgb(255, 0, 51) |
| RGB、レッド-グリーン-ブルー（red-green-blue (RGB)） | 色の値をrgbコードで指定します。関数の形式は rgb(R,G,B) で、値は0〜255の整数またはパーセンテージを使用できます。 |
rgb(255,0,51) rgb(255, 0, 51) rgb(100%,0%,20%) rgb(100%, 0%, 20%) |
| RGBA、レッド-グリーン-ブルー-アルファ（RGBa） | RGBa は RGB カラーモデルを拡張したもので、アルファチャンネルを含み、色の透明度を設定できます。a は透明度を表します：0=透明；1=不透明。 |
rgba(255,0,0,0.1) /* 10% 不透明 */ rgba(255,0,0,0.4) /* 40% 不透明 */ rgba(255,0,0,0.7) /* 70% 不透明 */ rgba(255,0,0, 1) /* 不透明，即红色 */ |
| HSL、色相-彩度-明度（Hue-saturation-lightness） | 色相（Hue）は色相環（虹を表す円環）の角度を表します。 彩度と明度はパーセンテージで表されます。 100% は最大の彩度で、0% はグレースケールです。 明度100% は白、明度0% は黒、明度50% は「普通」です。 |
hsl(120,100%,25%) /* 深绿色 */ hsl(120,100%,50%) /* 绿色 */ hsl(120,100%,75%) /* 浅绿色 */ |
| HSLA、色相-彩度-明度-アルファ（HSLa） | HSLa は HSL カラーモデルを拡張したもので、アルファチャンネルを含み、色の透明度を指定できます。 a は透明度を表します：0=透明；1=不透明。 |
hsla(240,100%,50%,0.05) /* 5% 不透明 */ hsla(240,100%,50%, 0.4) /* 40% 不透明 */ hsla(240,100%,50%, 0.7) /* 70% 不透明 */ hsla(240,100%,50%, 1) /* 完全不透明 */ |
その他の例
関連記事
CSS チュートリアル:CSS テキスト書式
その他の拡張