| 項 目 | 説 明 |
|---|---|
| 記述形式 | セレクタ {column-rule-color: 色 } |
| 値 の形式 | #rrggbb （RGB16進） | 色の名前 |
| 初 期 値 | colorプロパティ の値 |
| 対応ブラウザー | C3+ / e?+ / N?+ / Fx?+ / Op?+ / Ch9+ / Sa5+ |
| 適用可能な要素 | 段組を指定した要素 |
| 継 承 | しない |
column-rule-color プロパティ は，段組の 区切り線の色 を指定します。
色の指定方法は，"#" の後に R（赤），G（緑），B（青）の光の３原色をそれぞれ２桁の16進数で表した数値を並べた #rrggbb 形式で指定する方法や色の名前で指定する方法などがあります。（「色の値」を参照。）
以下に代表的な16色の #rrggbb と色の名前を示します。
| #rrggbb | 色の名前 | 表 示 |
|---|---|---|
#ffffff | white | |
#c0c0c0 | silver | |
#0000ff | blue | |
#00ffff | aqua | |
#00ff00 | lime | |
#ffff00 | yellow | |
#ff0000 | red | |
#ff00ff | fuchsia | |
#808080 | gray | |
#008080 | teal | |
#000000 | black | |
#000080 | navy | |
#008000 | green | |
#808000 | blue | |
#800000 | maroon | |
#800080 | purple |
なお、色の名前の一覧は原色大辞典のブラウザで名前が定義されている140色の色名，RGB の 16進数による色の一覧は、同じくカラーコード順のカラーチャートなどを参照してください。
CSS3 では，色の名前 や 16進数による色指定 のほかに，RGBカラー（rgb( )）， RGBAカラー（rgba( )）， HSLカラー（hsl( )）， HSLAカラー（hsla( )） などによる色指定の方法が提供されています。 ただし，ブラウザーがこれらの色指定方法に対応してない場合には， 色指定が無視された形の表示になりますので，注意が必要です。
また，CSS3 では，色を表すキーワード として，次のものが使用できます。
| キーワード | 表 示 色 |
|---|---|
| transparent | 透明であるかのように背景色で表示されます。 |
| currentColor | colorプロパティ の色の値を参照するときに 使用できます。 colorプロパティ での指定色で用いた場合は inherit と同様になります。 |
| HTMLソース | |
|---|---|
| CSS <head> ～ </head> |
<style type="text/css" media="screen, handheld, print, tv" >
<!--
div.mc35 {
width: 40em;
height: 9.2em;
column-count: 3;
column-rule-style: solid;
column-rule-width: 2px;
column-rule-color: lime;
border: solid blue 3px;
}
-->
</style> |
| HTML <body> ～ </body> |
<div>column-rule-color: lime; の場合</div>
<div class="mc35">
<p>他のプロパティの値に基づき段数を決めます。 （初期値）
<br>たとえば，column-width が auto 以外の値の場合には，
それに基づいて段数を決定します。</p>
<p>段組の段数 を 1 以上の整数で指定します。
もし，column-count と column-width がともに auto 以外の値の場合，
ここで指定した段数は 上限値 の意味になり，実際の段数は
column-width により決まる場合もあります。</p>
</div> |
| ブラウザー 表示例 |
|---|
column-rule-color: lime; の場合
他のプロパティの値に基づき段数を決めます。 （初期値）
段組の段数 を 1 以上の整数で指定します。 もし，column-count と column-width がともに auto 以外の値の場合， ここで指定した段数は 上限値 の意味になり，実際の段数は column-width により決まる場合もあります。 |