すべてのプロパティを設定し直す。
吊前 | all
|
---|---|
値 | initial | inherit | unset | revert | revert-layer |
初期値 | 個々のプロパティを見よ |
適用対象 | 個々のプロパティを見よ |
継承 | 個々のプロパティを見よ |
百分率 | 個々のプロパティを見よ |
算出値 | 個々のプロパティを見よ |
正準的順序 | 文法に従う |
アニメーション型 | 個々のプロパティを見よ |
all プロパティは、[direction、unicode-bidi]を除く、すべての CSS プロパティを設定し直す略式プロパティである。CSS 全域キーワードのみが、その値として受容される。また、カスタム プロパティ [css-variables-1] は設定し直さない。
除かれた[direction、unicode-bidi]プロパティは、実際にはマークアップ レベルの特能であり、作者スタイルシートには設定されるべきでない(それらは、ユーザー エージェントがサポートしていない文書言語をスタイルするための CSS プロパティとしてのみ存在する) [css-writing-modes-3]。作者は、HTML の dir 属性などの、適切なマークアップを代わりに利用するべきである。
以下のCSSが組み込んであります:
initial
<DIV style="color:red; font-size:40px;"> <DIV style="color:black; font-style:italic; ">あああ</DIV> </DIV>無指定
<DIV style="color:red; font-size:40px;"> <DIV style="color:black; font-style:italic; all:initial; ">あああ</DIV> </DIV>
<DIV class=Test1 style="color:pink; font-size:40px; ">あああ</DIV>無指定
<DIV class=Test1 style="color:pink; font-size:40px; all:initial; ">あああ</DIV>
inherit
<DIV style="color:red; font-size:40px;"> <DIV style="color:black; font-style:italic; all:inherit; ">あああ</DIV> </DIV>
<DIV class=Test1 style="color:pink; font-size:40px; all:inherit; ">あああ</DIV>
unset
【† “それまでに … すべての” ― これは、出現順序に従ってソートされるものに限られる。出自や詳細度など、より優先されるソート判定基準に基づいて選定される宣言値まで消去するわけではない。】
<DIV style="color:red; font-size:40px;"> <DIV style="color:black; font-style:italic; all:unset; ">あああ</DIV> </DIV>
<DIV class=Test1 style="color:pink; font-size:40px; all:unset; ">あああ</DIV>
revert
【巻戻し(rolling back): カスケード値を、より優先度が低い出自に属する宣言のみに基づくよう“戻す”。】【以下の定義には、重要度は織り込まれていない(織り込まれるとするなら、important な宣言に対する巻戻しは、通常の宣言とは“逆向き”になろう)。】
<DIV style="color:red; font-size:40px;"> <DIV style="color:black; font-style:italic; all:revert; ">あああ</DIV> </DIV>
<DIV class=Test1 style="color:pink; font-size:40px; all:rever; ">あああ</DIV>
revert-layer
注記: revert-layer 値が属する出自の中で、より優先度が低い宣言が無い場合、revert キーワードと同じく、カスケード値は より優先度が低い出自へ巻戻されることになる。
<DIV style="color:red; font-size:40px;"> <DIV style="color:black; font-style:italic; all:revert-layer; ">あああ</DIV> </DIV>
<DIV class=Test1 style="color:pink; font-size:40px; all:revert-layer; ">あああ</DIV>
表示内容: |
表示内容: |