background

CSS システム色

[1] システム色 (System Colors) は、システムにおいて UI の構成要素に与えられているを表すキーワードです。

代替

[2] システム色CSS2 で導入されましたが、 CSS3非推奨 >>3 とされています。

[38] システム色は複数の特性で特定の組み合わせを指定することにより当該システムUI を再現しようとするものですが、も含めた様々な見た目を一括で指定できる 'appearance' 特性を使う方が望ましいとされています >>3

仕様書

システム色の一覧

[36] システム色の名前と意味は次の通りです >>3

[8] ActiveBorder
活性窓境界線です。
[9] ActiveCaption
活性窓見出しです。
[10] AppWorkspace
MDI背景色です。
[11] Background
デスクトップ背景色です。
[12] ButtonFace
周りに境界線の層が1つあって三次元に見える三次元要素の表面 (face) の部分の背景色です。
[13] ButtonHighlight
周りに境界線の層が1つあって三次元に見える三次元要素の光源側の部分の背景色です。
[14] ButtonShadow
周りに境界線の層が1つあって三次元に見える三次元要素の光源から遠い側の部分の背景色です。
[15] ButtonText
押しボタン文字色です。
[16] CaptionText
見出しサイズ箱スクロールバー矢印箱文字色です。
[17] GrayText
灰色化された (無効状態の) 文字色です。 現在ディスプレイドライバー立体灰色 (solid gray color) に対応していないなら、 #000 () です。
[18] Highlight
制御子中で選択されている項目のです。
[19] HighlightText
制御子中で選択されている項目の文字色です。
[20] InactiveBorder
非活性窓枠線です。
[21] InactiveCaption
非活性窓見出しです。
[22] InactiveCaptionText
非活性窓見出し文字色です。
[23] InfoBackground
ツールチップ背景色です。
[24] InfoText
ツールチップ文字色です。
[25] Menu
メニュー背景色です。
[26] MenuText
メニュー文字色です。
[27] Scrollbar
スクロールバー灰色領域 (gray area) です。
[28] ThreeDDarkShadow
周りに同心境界線の層が2つあって三次元に見える三次元要素の光源から遠い部分の暗い方 (通常は外側) のです。
[29] ThreeDFace
周りに同心境界線の層が2つあって三次元に見える三次元要素の表面 (face) 背景色です。
[30] ThreeDHighlight
周りに同心境界線の層が2つあって三次元に見える三次元要素の光源に近い部分の明るい方 (通常は外側) のです。
[31] ThreeDLightShadow
周りに同心境界線の層が2つあって三次元に見える三次元要素の光源に近い部分の暗い方 (通常は内側) のです。
[32] ThreeDShadow
周りに同心境界線の層が2つあって三次元に見える三次元要素の光源から遠い部分の明るい方 (通常は内側) のです。
[33] Window
背景色です。
[34] WindowFrame
です。
[35] WindowText
文字色です。

構文

[6] システム色CSSキーワードとして表します。システム色<color> を使える場所で使うことができます。

[7] システム色大文字・小文字不区別ですが、仕様書において記述されている、 読みやすい大文字小文字を混合した書き方を使うべきとされています >>3

レンダリング

[4] 相当する値を持たないシステムにあっては、最も近いシステム色の値とするか、または何らかの既定のとするべきです>>3

プロファイル

[5] CSSプロファイルによってはシステム色に全く対応していません。 >>3

歴史

CSS2

[40] システム色CSS 2.0 で導入されました。

[41] CSS 2.1 には、 CSS3 では非推奨となっている、と注意書きがあります >>39

関連

[42] 同様にシステムにおけるフォント設定を表している「システム・フォント」を 'font' 特性に指定できます。

[37]

p { color: WindowText; background-color: Window }

段落前景色背景色によりレンダリングします >>3

[43] CSS Basic User Interface Module Level 3 (CSS3 UI) ( (Tantek Çelik 著, 版)) http://www.w3.org/TR/2012/WD-css3-ui-20120117/#changes-list

[44] [css-colors] Specify the System Colors colors ( (Simon Pieters 著, 版)) http://lists.w3.org/Archives/Public/www-style/2013Aug/0667.html

[45] [Fwd: System colors] ( (L. David Baron 著, 版)) http://lists.w3.org/Archives/Public/www-archive/2013Aug/0027.html

[46] CSS System colors ( (Simon Pieters 著, 版)) http://lists.w3.org/Archives/Public/www-archive/2013Aug/0026.html

[47] gecko-dev/widget/windows/nsLookAndFeel.cpp at master · mozilla/gecko-dev ( ( 版)) https://github.com/mozilla/gecko-dev/blob/master/widget/windows/nsLookAndFeel.cpp

[48] GetSysColor function (Windows) ( ( 版)) http://msdn.microsoft.com/en-us/library/windows/desktop/ms724371(v=vs.85).aspx

[49] <color> - CSS | MDN ( ( 版)) https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#System_Colors

[50] [css-color-3] Remove old note for the appearance property (GloverDonovan著, ) https://github.com/w3c/csswg-drafts/commit/43b163e4445b9935c0bae38f1a5b0f803d25ff69

[51] [css-color-3] Remove old note for the appearance property by GloverDonovan · Pull Request #2334 · w3c/csswg-drafts () https://github.com/w3c/csswg-drafts/pull/2334

[52] [css-color-3] Dangling link to `appearance` property in CR of Color-3 · Issue #2089 · w3c/csswg-drafts () https://github.com/w3c/csswg-drafts/issues/2089

[53] system colors posts from 2001 (L. David Baron著, ) https://lists.w3.org/Archives/Public/www-archive/2019Apr/0000.html