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) |
| 正規順序 | 形式文法で定義される一意のあいまいでない順序 |
ブラウザーの対応
| 機能 | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| 基本対応 | 37 | ? | 27 | なし | 24 | なし |
revert | なし | ? | なし | なし | なし | 9.1 |
| 機能 | Android webview | Chrome for Android | Edge mobile | Firefox for Android | Opera Android | iOS Safari | Samsung Internet |
|---|---|---|---|---|---|---|---|
| 基本対応 | なし | ? | ? | 27 | なし | なし | ? |
revert | なし | ? | ? | なし | なし | 9.3 | なし |