この特性は,ポインティング装置に表示されるカーソルの型を指定する。値には次の意味がある。
P { cursor : url("mything.cur"), url("second.csr"), text; }
あらかじめ定義された色値をテキスト,背景等に割り当てることができる以外に, CSS2により,文書作成者は利用者の図形環境に統合するという方法で,色を指定することができる。 利用者の好みを考慮するスタイル規則には次の利点がある。
システム色に定義される値の集合は,あらゆる値を網羅することを意図している。システムに対応する値がない場合は,最も近似するシステム属性又はデフォルト色に指定値を対応付けるのがよい。
次は,色関連のCSS属性及びその一般的な意味について,付加的な値を列挙したものである。い ずれの色特性 ( 'color' 又は 'background-color'など)も次の名前を一つとる ことができる。これらは大文字及び小文字を区別しないが,より読み易くするために,後述するよ うに大文字及び小文字を混在させることを推奨する。
例えば, 段落の前景の色及び背景の色を利用者のウィンドウと同じに設定するためには,次のよう に書く。
P { color: WindowText; background-color: Window }
色の場合と同様に, 文書作成者は利用者のシステム資源を利用する方法でフォントを指定して よい。詳細については, 'font'特性を参照。
スタイルシートの文書作成者が,ボタン,活性フォームフィールド,画像マップ等の視覚オブ ジェクトを強調するために,その周囲に輪郭線を生成したいと考えることもある。CSS2の輪郭線が 境界と異なる点を次に示す。
輪郭線特性は,これらの動的な輪郭線のスタイルを制御する。
値: | [ <'outline-color'> || <'outline-style'> || <'outline-width'> ] | inherit |
初期値: | 個々の特性を参照 |
適用対象: | すべての要素 |
継承: | しない |
パーセント値: | N/A |
メディア: | 視覚メディア, 対話式メディア |
値: | <border-width> | inherit |
初期値: | medium |
適用対象: | すべての要素 |
継承: | しない |
パーセント値: | N/A |
メディア: | メディア, 対話式メディア |
値: | <border-style> | inherit |
初期値: | none |
適用対象: | すべての要素 |
継承: | しない |
パーセント値: | N/A |
メディア: | 視覚メディア, 対話式メディア |
値: | <color> | invert | inherit |
初期値: | invert |
適用対象: | すべての要素 |
継承: | しない |
パーセント値: | N/A |
メディア: | 視覚メディア, 対話式メディア |
輪郭線特性を用いて生成される輪郭線はボックスに"重ねて"描画される。即ち,輪郭線は常に前 面に描画され,対象となるボックス又はその他のすべてのボックスの位置又はサイズに影響しない。 そのため,輪郭線の表示又は非表示によって,再流し込みが生じることはない。
輪郭線は 境界辺のすぐ外側に描画される。
輪郭線は長方形でなくてもよい。例えば,要素が複数行に分割される場合は,輪郭線は,要素の ボックスをすべて囲む最小の輪郭線となる。 境界とは異なり, 輪郭線は行ボックスの末尾又は先頭で も描画されるが,常に十分な連動が保たれている。
'outline-width'特性は 'border-width'と同じ値を使用することができる。
'outline-style'特性は 'border-style'と同じ値を使用することができる。た だし,'hidden'が不当な輪郭線スタイルである場合を除く。
'outline-color'は, キーワード'invert'をはじめとするすべての色を指定することができ る。 'Invert'は画面上の画素の色反転を実行する。これは,背景色にかかわらず,フォーカス境界 を確実にレンダリングするための一般的なトリックである。
'outline'特性は簡略記述特性であり, 'outline-style', 'outline-width' 及び 'outline-color'の三つをすべて設定する。
備考:輪郭線はすべての辺で同じである。境界とは異なり,'outline-top' 特性又は 'outline-left'特性は存在しない。
この規定は,輪郭線が複数重なる場合,それをどのように描画するか又はボックスの一部が他の 要素の背面に隠れる場合に,輪郭線をどのように描画するかは定義しない。
備考: フォーカス輪郭線はフォーマットに影響しない,即ち,ボックスモデルには輪郭線のためのスペー スが存在しないため,輪郭線はページ上のその他の要素とうまく重なる場合がある。
ここでは,BOTTON要素の周囲に太い輪郭線を描画する例を示す。
BUTTON { outline-width : thick }
再流し込みを起こさずに,輪郭線の幅を動的に変更するため,スクリプトを使用する。
図形による利用者インタフェースは,要素の周囲に輪郭線を施して,利用者にページ上の どの要素が フォーカスを有するかを知らせてもよい。 これらの輪郭線は,境界とは全く別であり,輪郭線の表示又は非表示の切換えによって,文書を再流し込が生じないことが望ましい。フォーカスは,テキストを入力したり,ボタンを選択するなど,文書の 利用者対話の主体である。 対話式メディアグループをサポートする利用者 エージェントは,フォーカスがどこに存在するかを追跡し,同時にフォーカスを表示しなければな らない。この場合,:focus 擬似クラスを動的な輪郭線と併用すればよい。
例えば, 要素がフォーカスを有する場合,その要素の周囲に太い黒線を描画し,要素が活性化し ている場合に太い赤線を描画するには,次の規則を使用することができる。
:focus { outline: thick solid black } :active { outline: thick solid red }
CSS作業グループは,スタイルシートで文書又はその一部の拡大表示を指定しないほうがよいと 考えている。利用者エージェントは,画像を大きくする,音声を大きくする等,別の方法でこれを 実現してもよい。
ページを拡大する場合, UAは位置指定された要素間の関係を保持するのがよい。例えば,こま 割り漫画がテキスト要素を重ねた画像色作成されてもよい。利用者エージェントは,このページを 拡大する場合,漫画の吹き出しの中にテキストが収まるようにするのがよい。