CSS の all 一括指定プロパティは、要素のすべてのプロパティを (unicode-bidi および direction を除いて) 初期化します。プロパティは初期値または継承値、または他のスタイルシートに由来して指定した値に設定される可能性があります。
このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 https://github.com/mdn/interactive-examples をクローンしてプルリクエストを送信してください。
構文
/* グローバル値 */ all: initial; all: inherit; all: unset; /* CSS カスケードと継承 Level 4 */ all: revert;
all プロパティは、 CSS のグローバルキーワード値のうちの一つで定義します。なお、これらの値は unicode-bidi および direction プロパティには影響しません。
値
initial- その要素のすべてのプロパティを初期値に変更するべきであることを指定します。
inherit- その要素のすべてのプロパティを継承値に変更するべきであることを指定します。
unset- その要素のすべてのプロパティを、既定値が inherit のものは継承値に、そうでなければ初期値に変更するべきであることを指定します。
revert- 宣言が所属するスタイルシートの出所に応じて動作を指定します。
形式文法
initial | inherit | unset | revert
例
HTML
<blockquote id="quote"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </blockquote> Phasellus eget velit sagittis.
CSS
body {
font-size: small;
background-color: #F0F0F0;
color: blue;
}
blockquote {
background-color: skyblue;
color: red;
}
結果
all プロパティなし
<blockquote> は、特定の背景色と文字色と一緒に、ブラウザーの標準スタイルを使用します。blockquoteはブロック要素のようにふるまいます。これに続くテキストはその下にあります。
all:unset
<blockquote> はブラウザーの標準スタイルを使用しません。 blockquote はインライン要素 (初期値) であり、 background-color は transparent (初期値) ですが、 font-size は small (継承された値) のままで、かつ colorはblue (継承された値) です。
all:initial
<blockquote> はブラウザーの標準スタイルを使用しません。 blockquote はインライン要素 (初期値) であり、background-colorはtransparent (初期値)、font-sizeはnormal (初期値)、且つcolorは black (初期値)です。
all:inherit
<blockquote> はブラウザーの標準スタイルを使用しません。blockquoteはブロック要素 (blockquoteを含んでいる<div>から継承された値)であり、background-colorはtransparent(初期値)、font-sizeはsmall (継承された値)、且つ colorはblue (継承された値)です。
仕様書
| 仕様書 | 状態 | 備考 |
|---|---|---|
| CSS Cascading and Inheritance Level 4 all の定義 |
勧告候補 | revert の値を追加。 |
| CSS Cascading and Inheritance Level 3 all の定義 |
勧告候補 | 初回定義 |
| 初期値 | There is no practical initial value for it. |
|---|---|
| 適用対象 | すべての要素 |
| 継承 | なし |
| メディア | There is no practical media for it. |
| 計算値 | as the specified value applies to each property this is a shorthand for. |
| アニメーションの種類 | as each of the properties of the shorthand (all properties but unicode-bidi and direction) |
| 正規順序 | 形式文法で定義される一意のあいまいでない順序 |
ブラウザーの対応
| デスクトップ | モバイル | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
all | Chrome 完全対応 37 | Edge 未対応 なし | Firefox 完全対応 27 | IE 未対応 なし | Opera 完全対応 24 | Safari 完全対応 9.1 | WebView Android 完全対応 37 | Chrome Android 完全対応 37 | Edge Mobile 未対応 なし | Firefox Android 完全対応 27 | Opera Android 完全対応 24 | Safari iOS 完全対応 9.3 | Samsung Internet Android 完全対応 4.0 |
revert | Chrome 未対応 なし | Edge 未対応 なし | Firefox 未対応 なし | IE 未対応 なし | Opera 未対応 なし | Safari 完全対応 9.1 | WebView Android 未対応 なし | Chrome Android 未対応 なし | Edge Mobile 未対応 なし | Firefox Android 未対応 なし | Opera Android 未対応 なし | Safari iOS 完全対応 9.3 | Samsung Internet Android 未対応 なし |
凡例
- 完全対応
- 完全対応
- 未対応
- 未対応