× Directory [1]initial [2]inherit [3]unset [4]revert [5]all
CSSでは、理論的には任意のCSSプロパティに適用できるキーワードが4つあります。初期(初期)、継承(継承)、アンセット(未設定)、リバート(復元)です。 all の値は、上記の 4 つのキーワードのみです。この記事では、initial、inherit、unset、revertなどを紹介します
要素属性の初期デフォルト値を表します(デフォルト値は公式のCSS仕様で定義されています)
互換性: IEはサポートしていません
【注意事項】 各属性の初期デフォルト値をここに移動しました
//display在官方CSS规范中定义的默认值是inline<style>.test{display: initial;}</style><div class="box"> <div class="test">测试一</div><span>文字</span> <br> <div >测试二</div><span>文字</span></div>
要素の直接の親要素に対応する属性の計算値を表します
互換性: IE7 非対応Supported
rrree
unsetはinitialやinheritよりも比較的複雑です。プロパティがデフォルトで継承可能な場合、値は継承可能であることを示し、それ以外の場合、値は初期値になります。実際、unset を設定することは、設定しないことと同じです
互換性: IE はサポートしません、safari9- はサポートしません、ios9.2- はサポートしません、android4.4.4- はサポートしません
[一般的に使用されるデフォルトの継承可能なスタイル]
<style>.box{ border: 1px solid black; padding: 10px; width: 100px;}.test{ border: inherit; height: 30px;}</style><div class="box"> <div class="test">测试一</div></div><div class="box"> <div class="in"> <div class="test">测试二</div> </div></div>
colorcursordirectionfontletter-spacingline-heightlist-styletext-aligntext-indenttext-shadowtext-transformwhite-spaceword-breakword-spacingword-wrapwriting-mode
スタイルシートに定義されている要素属性のデフォルト値を表します。ユーザー定義のスタイル シートで明示的に設定されている場合は、この設定に従います。それ以外の場合は、未設定と同等です。
互換性: safari9.1+ および ios9 でのみサポートされます。 3+
all Supported, ios9.2-not support, android4.4-not support
//内容为测试一的元素和内容为测试二的元素的样式是一样的<style>.box{ border: 1px solid black; padding: 10px; width: 100px; color: red;}.test1{ border: unset; color: unset;}</style><div class="box"> <div class="test">测试一</div> <div>测试二</div></div>
<style>.test{ border: 1px solid black; padding: 20px; color: red;}.in{/* all: initial; all: inherit; all: unset; all: revert; */}</style><div class="test"> <div class="in">测试文字</div> </div>
【2】の場合all:inherit [3] all:unset の場合、.in のすべての属性は値を設定しないことと同じになります。デフォルトの継承可能な属性は継承され、継承できない属性はデフォルト値のままになります。