CSSスナップショット 2024

W3Cグループノート

この文書の詳細
このバージョン:
https://www.w3.org/TR/2025/NOTE-css-2024-20250225/
最新公開バージョン:
https://www.w3.org/TR/css-2024/
編集者ドラフト:
https://drafts.csswg.org/css-2024/
履歴:
https://www.w3.org/standards/history/css-2024/
フィードバック:
CSSWG課題リポジトリ
編集者:
Tab Atkins Jr. (Google)
Elika J. Etemad / fantasai (Apple)
Florian Rivoal (招待専門家)
Chris Lilley (W3C)
(招待専門家)
この仕様への編集提案:
GitHubエディター

概要

本書は、2024年時点でのカスケーディングスタイルシート(CSS)の現状を構成するすべての仕様をひとつの定義にまとめたものです。主な読者はCSSの著者ではなく、実装者です。なぜなら、この定義はWebブラウザーの採用率ではなく、仕様の安定性によってモジュールを分類しているためです。

CSSは、構造化文書(HTMLやXMLなど)のレンダリング方法を、画面や紙などに記述するための言語です。

この文書のステータス

このセクションは、公開時点でのこの文書のステータスを説明します。 現在のW3C出版物一覧や、この技術レポートの最新改訂版は W3C技術レポートインデックス(https://www.w3.org/TR/)で確認できます。

本書はCSSワーキンググループにより ノートトラックを用いてグループノートとして公開されました。 グループノートはW3Cおよびその会員による承認を受けていません。

ご意見は、GitHubでIssueを提出(推奨)してください。その際、タイトルに仕様コード「css-2024」を含めてください(例: “[css-2024] …コメント概要…”)。 すべてのIssueとコメントはアーカイブされています。 または、(アーカイブ済み)の公開メーリングリスト www-style@w3.orgへ送信することもできます。

この文書は、2023年11月3日版W3Cプロセス文書に準拠しています。

2020年9月15日版W3C特許ポリシーは、本書に対していかなるライセンス要件や義務も課していません。

本書は2024年時点でのCSSの現状を示しています。

1. はじめに

最初のCSS仕様が公開された際、CSS全体はCSSレベル1を定義する1つの文書にまとめられていました。CSSレベル2も単一の複数章からなる文書で定義されていました。しかし、CSSレベル2以降については、CSSワーキンググループはモジュール方式を採用し、各モジュールがCSSの一部分を定義する形にしました。これにより、仕様はより管理しやすい単位に分割され、CSSの即時的かつ段階的な改善が可能となりました。

異なるCSSモジュールは安定性のレベルが異なるため、CSSワーキンググループは2024年時点でのカスケーディングスタイルシートの現状と範囲を定義するために本プロファイルの公開を決定しました。

1.1. CSSとは?

カスケーディングスタイルシート (CSS)
CSSはスタイルシートを記述するための言語であり、構造化文書(HTMLやXMLなど)のレンダリングを様々な媒体で記述するために設計されています。CSSはソース文書の表示方法を記述するために使われ、通常、その文書言語で表現された基礎的な意味を変更することはありません。
スタイルシート
文書の表示を指定する一連のルールです。スタイルシートは著者によって記述され、ユーザーエージェントによって解釈され、ユーザーに文書を提示します。
ソース文書
1つ以上のスタイルシートが適用される文書。ソース文書の構造や意味は文書言語(例: HTML, XHTML, SVG)を用いて符号化されます。
著者
著者は文書および関連するスタイルシートを書く人です。オーサリングツールは、スタイルシートを生成するユーザーエージェントです。
ユーザー
ユーザーは、ユーザーエージェントを操作して文書を閲覧・聴取・その他利用する人です。
ユーザーエージェント (UA)
ユーザーエージェントは、文書および関連するスタイルシートをユーザーの代わりに解釈するプログラムです。ユーザーエージェントは文書を表示したり、音声で読み上げたり、印刷したり、別形式に変換したりすることができます。CSS仕様においては、ユーザーエージェントはこれらの仕様で定義されるカスケーディングスタイルシートをサポート・解釈するものを指します。

1.2. 背景:W3CプロセスとCSS

このセクションは規定ではありません(非規定)。

W3Cプロセスでは、勧告トラック文書は以下の3つの安定性レベルを経て進行します。概要は以下の通りです:

ワーキングドラフト (WD)

これはW3C仕様の設計フェーズです。WGは内部・外部のフィードバックに応じて仕様を繰り返し修正します。

最初の公式なワーキングドラフトは「First Public Working Draft」(FPWD)と呼ばれます。CSSWGではFPWDの公開は、ワーキンググループ全体がそのモジュールの編集者ドラフトで示された範囲・提案に従って取り組むことに合意したことを示します。

次の段階への移行は「Last Call Working Draft」(LCWD)フェーズと呼ばれることがあります。CSSWGは既知の課題がすべて解決され、テストや実装からのフィードバックなしでは進展できなくなった時点でワーキングドラフトを移行します。

この「最終コメント募集」では、未解決の課題報告の期限を設け、WGが特にフィードバックを追跡・対処する必要があります。コメント追跡文書はDisposition of Comments(DoC)です。これは広範なレビューと受け入れを示すために、更新ドラフトと共にDirectorの承認に提出されます。

候補勧告 (CR)
これはW3C仕様のテストフェーズです。この段階は、仕様をテストするためのテストや実装の利用が目的であり、実装自体をテストすることではありません。このプロセスで仕様のさらなる課題が判明することも多く、候補勧告は実装・テストからのフィードバックに応じて徐々に変化しますが、設計フェーズ(WD)ほど大きくは変わりません。

CRを終了するには各機能ごとに正しく独立した2つの実装のデモンストレーションが必要です。このフェーズではWGがテストスイートを作り、実装報告書を生成します。

次の段階への移行は「提案勧告」(PR)です。このフェーズではW3C諮問委員会がRECへの移行を承認する必要があります。

勧告 (REC)
これはW3C仕様の完成状態であり、保守フェーズを表します。この時点でWGは正誤表(errata)文書のみを管理し、時折正誤表を組み込んだ改訂版を公開します。

編集者ドラフトは、編集者自身の作業コピーのライブ版です。WGの合意を必ずしも反映していない場合があり、時には自己矛盾した状態になることもあります。(W3Cでの公開プロセスは時間と手間がかかるため、編集者ドラフトが最も最新で参照すべき仕様となることが多いです。現在、公式ドラフトが定期的に最新の状態となるよう公開の摩擦を減らす取り組みが進められており、編集者ドラフトは元の作業用スペースとしての役割に戻る見込みです。)

2. CSS仕様の分類

安定版・進行中すべてのCSSモジュールとそのステータス一覧はCSS Current Workページで確認できます。

2.1. カスケーディングスタイルシート(CSS) — 公式定義

本プロファイルには、安定していると考えられ、かつその安定性を確信できる十分な実装経験がある仕様のみを含みます。

注: これはCSSデスクトップブラウザプロファイルを意図したものではありません。このプロファイルへの収録は機能の安定性のみを基準としており、利用想定やWebブラウザでの採用状況は考慮していません。本プロファイルはCSSの最も完全な形を定義します。

2024年時点で、カスケーディングスタイルシート(CSS)は以下の仕様によって定義されています。

CSSレベル2(最新版)(正誤表含む) [CSS2]
CSSのコアを定義しており、後の仕様によって一部が上書きされています。特に第2章はCSSの基本的な概念や設計原則を紹介しているため、推奨します。
CSS構文レベル3 [CSS-SYNTAX-3]
CSS2§4.1, §4.2, §4.4, §G を置き換え、CSSの構文解析方法を再定義します。
CSSスタイル属性 [CSS-STYLE-ATTR]
マークアップ属性内にCSS宣言を埋め込む方法を定義します。
メディアクエリレベル3 [CSS3-MEDIAQUERIES]
CSS2§7.3を置き換え、メディア固有のスタイルの構文を拡張します。
CSS条件付き規則レベル3 [CSS-CONDITIONAL-3]
CSS2§7.2を拡張・置き換え、@media規則のネスト対応や、機能サポート判定用の@supports規則を導入します。
セレクターレベル3 [SELECTORS-3]
CSS2§5および§6.4.3を置き換え、セレクターの範囲を拡張します。
CSS名前空間 [CSS3-NAMESPACE]
セレクターに名前空間プレフィックスを付与する@namespace規則を導入します。
CSSカスケードと継承レベル4 [CSS-CASCADE-4]
CSS2§1.4.3, §6および[CSS-CASCADE-3]を拡張・置き換えます。スタイル規則の集約方法や、すべての要素のすべてのプロパティへの値の割り当て方法を説明します。カスケードと継承により、すべてのプロパティに値が伝搬されます。
CSS値と単位レベル3 [CSS-VALUES-3]
CSS2§1.4.2.1, §4.3, §A.2.1–3を拡張・置き換え、CSSのプロパティ定義構文と単位のセットを拡張します。
CSSカスケーディング変数モジュールレベル1(カスタムプロパティ) [CSS-VARIABLES-1]
すべてのCSSプロパティで受理される新しいプリミティブ値型としてカスケーディング変数を導入し、カスタムプロパティで定義可能にします。
CSSボックスモデルレベル3 [CSS-BOX-3]
CSS2§8.1, §8.2, §8.3(§8.3.1は除く), §8.4を置き換えます。
CSSカラー レベル4 [CSS-COLOR-4]
CSS2§4.3.6, §14.1, §18.2と[CSS-COLOR-3]を拡張・置き換え、sRGBを超える拡張色空間や拡張色値、CSSオブジェクトモデルの拡張を導入します。またopacityプロパティも定義します。
CSS背景とボーダー レベル3 [CSS-BACKGROUNDS-3]
CSS2§8.5, §14.2を拡張・置き換え、背景やボーダーの多層画像・画像ボーダー・ドロップシャドウなどの詳細制御を提供します。
CSS画像レベル3 [CSS-IMAGES-3]
外部2D画像値型を再定義・統合し、ネイティブ2Dグラデーションや置換要素のサイズ・レンダリング制御を拡張します。
CSSフォントレベル3 [CSS-FONTS-3]
CSS2§15を拡張・置き換え、フォントの選択や機能選択の詳細制御を提供します。
CSS書字モードレベル3 [CSS-WRITING-MODES-3]
左から右(例: ラテンやインド系)、右から左(例: ヘブライ語やアラビア語)、双方向(例: ラテン語とアラビア語の混在)、縦書き(例: アジアの文字体系)など、国際的な書字モードへのCSS対応を定義します。CSS2§8.6, §9.10を置き換え・拡張します。
CSSマルチカラムレイアウトレベル1 [CSS-MULTICOL-1]
CSSレイアウトにマルチカラムフローを導入します。
CSSフレキシブルボックスモジュールレベル1 [CSS-FLEXBOX-1]
CSSに柔軟な線形レイアウトモデルを導入します。
CSS基本ユーザーインターフェースモジュールレベル3 [CSS-UI-3]
CSS2§18.1, §18.4を拡張・置き換え、cursoroutlineなどのプロパティや新しいCSS機能によるUI強化を定義します。
CSSコンテインメントモジュールレベル1 [CSS-CONTAIN-1]
containプロパティを導入し、要素のサブツリーごとの独立したCSS処理を強制することで、ユーザーエージェントによる大幅な最適化を可能にします。
CSS変形レベル1 [CSS-TRANSFORMS-1]
CSSに座標ベースのグラフィック変形を導入します。
CSS合成とブレンディングレベル1 [COMPOSITING]
重ね合わせたコンテンツの合成とブレンディングを定義し、モード制御機能を導入します。
CSSイージング関数レベル1 [CSS-EASING-1].
著者が値の変化率を制御する変換を定義できる方法を記述します。アニメーションに適用すると、物理現象(慣性など)を模した動きや、ロボット的なステップ移動のアニメーションを作ることができます。
CSSカウンタースタイルレベル3 [CSS-COUNTER-STYLES-3]
@counter-style規則を導入し、著者がCSSリストマーカーや生成コンテンツ用カウンターのカスタムカウンタースタイルを独自定義できます。CSS2やCSS2.1に含まれるものも含め、一般的なカウンタースタイルのセットもあらかじめ定義されています。[CSS-LISTS-3]

注: このスナップショットを構成する仕様に大きな変更が加わることは想定していませんが、収録されたからといって凍結されているわけではありません。ワーキンググループはこれらの仕様に問題を見つけ次第、継続して対応を行います。実装者はwww-styleCSSワーキンググループブログを監視し、変更や修正・明確化に注意してください。

2.2. 信頼性の高い候補勧告

以下の仕様は、信頼性の高い状態にあると考えられており、主に仕様や実装が安定していますが、細かな課題や追加の実装報告が必要なため、まだ勧告レベルには達していません。

メディアクエリ レベル4 [MEDIAQUERIES-4]
[CSS3-MEDIAQUERIES]を拡張・置き換え、構文の拡張、多くのメディアタイプの非推奨化、新しいメディア特性の導入を行います。
CSSスクロールスナップモジュール レベル1 [CSS-SCROLL-SNAP-1]
「スナップ位置」によるパンやスクロール挙動の制御機能を含みます。
CSSスクロールバー スタイリングモジュール レベル1 [CSS-SCROLLBARS-1]
スクロールバーの色や幅など、視覚的なスタイリングを制御するプロパティを定義します。
CSSグリッドレイアウトモジュール レベル1 [CSS-GRID-1]
ユーザーインターフェースデザインに最適化された二次元グリッドレイアウトシステムを導入します。グリッドレイアウトモデルでは、グリッドコンテナの子要素を柔軟または固定サイズのレイアウトグリッドの任意のスロットに配置できます。
CSSグリッドレイアウトモジュール レベル2 [CSS-GRID-2]
[CSS-GRID-1]を拡張・置き換え、共有グリッドフレームワーク内で入れ子構造を管理する「サブグリッド」を導入します。

2.3. 十分に安定しているが実装経験が限られるモジュール

以下のモジュールは設計作業を完了し、かなり安定していますが、十分なテストや実装経験はまだありません。将来のスナップショットでCSSの公式定義に組み込むことを目指しています。

メディアクエリ レベル4 [MEDIAQUERIES-4]
[CSS3-MEDIAQUERIES]を拡張・置き換え、構文の拡張、多くのメディアタイプの非推奨化、新しいメディア特性の導入を行います。
CSSディスプレイモジュール レベル3 [CSS-DISPLAY-3]
CSS2§9.1.2、§9.2.1(§9.2.1.1は除く)、§9.2.2(§9.2.2.1は除く)、§9.2.3、§9.2.4(および§9.7の置き換えの基礎)を置き換え、CSSフォーマットボックスツリーの生成方法と、それを制御するdisplayプロパティを定義します。
CSS書字モード レベル4 [CSS-WRITING-MODES-4]
[CSS-WRITING-MODES-3]を拡張・置き換え、縦書きの選択肢を追加します。
CSSフラグメンテーションモジュール レベル3 [CSS-BREAK-3]
フローをページ、カラム、リージョンに分割するフラグメンテーションモデルを記述し、それを制御するプロパティを定義します。CSS2§13.3を拡張・置き換えます。
CSSボックスアライメントモジュール レベル3 [CSS-ALIGN-3]
ボックスレイアウトモデル(ブロック、テーブル、フレックス、グリッド)の各コンテナ内でボックスの整列を制御するプロパティを導入します。
CSSシェイプモジュール レベル1 [CSS-SHAPES-1]
フロート(CSS2§9.5)を拡張し、非矩形の回り込み形状を実現します。
CSSテキストモジュール レベル3 [CSS-TEXT-3]
CSS2§16(§16.3は除く)を拡張・置き換え、テキスト操作用プロパティとその処理モデルを定義します。改行、揃え、空白処理、テキスト変形などをカバーします。
CSSテキストデコレーションモジュール レベル3 [CSS-TEXT-DECOR-3]
CSS2§16.3を拡張・置き換え、テキストデコレーションラインの詳細制御、強調マークやテキストシャドウ指定機能を追加します。
CSSマスキングモジュール レベル1 [CSS-MASKING-1]
CSS2§11.1.2を置き換え、より強力なクリッピングやマスキング機能を導入します。
CSSスクロールスナップモジュール レベル1 [CSS-SCROLL-SNAP-1]
「スナップ位置」によるパンやスクロール挙動の制御機能を含みます。
CSSスピーチモジュール レベル1 [CSS-SPEECH-1]
CSS2§A(非規定の音声レンダリング章)を全面的に見直します。
CSSビュー遷移モジュール レベル1 [CSS-VIEW-TRANSITIONS-1]
View Transition APIと関連プロパティ・疑似要素を定義し、ドキュメント状態の変化を表現するアニメーション付き視覚的遷移を開発者が作成できるようにします。

2.4. 粗い相互運用性のモジュール

以下のモジュールは広く展開されており、粗い相互運用性はあるものの、詳細が十分に詰められていない、あるいは仕様化が不十分で、さらなるテストやバグ修正が必要です。将来のスナップショットでCSSの公式定義に組み込むことを目指しています。

CSSトランジション レベル1 [CSS-TRANSITIONS-1] および CSSアニメーション レベル1 [CSS-ANIMATIONS-1]
CSSプロパティの算出値を時間経過で遷移させる仕組みを導入します。
CSSウィルチェンジ レベル1 [CSS-WILL-CHANGE-1]
will-changeというパフォーマンスヒント用プロパティを導入します。
フィルター効果モジュール レベル1 [FILTER-EFFECTS-1]
要素のレンダリング処理にフィルター効果を加える手段を導入します。
CSSフォントローディングモジュール レベル3 [CSS-FONT-LOADING-3]
フォントリソースの動的ロードのためのイベントやインターフェースを導入します。
CSSボックスサイズ レベル3 [CSS-SIZING-3]
CSS§10を拡張・重ね合わせ、サイズプロパティの値セット拡張、より厳密なサイズ用語の導入、CSS2では曖昧だった自動サイズ関連概念を詳細定義します。
CSS変形 レベル2 [CSS-TRANSFORMS-2]
[CSS-TRANSFORMS-1]を基に、3次元変形用の新しい変形関数やプロパティ、単純変形用の便宜関数を追加します。
CSSリストとカウンター モジュール レベル3 [CSS-LISTS-3]
リストカウンターのスタイリング・位置・値操作に関するCSS機能を含みます。
CSS論理プロパティ・値 レベル1 [CSS-LOGICAL-1]
物理的方向や寸法ではなく論理的方向・寸法でレイアウト制御できるプロパティ・値を導入します。[CSS2]で定義された機能にも論理プロパティ・値を定義します。これらプロパティは対応する物理プロパティの書字モード相対版です。
CSS配置レイアウトモジュール レベル3 [CSS-POSITION-3]
CSSの座標ベースの配置とオフセット方式(相対配置sticky配置絶対配置固定配置)を定義します。
リサイズオブザーバー [RESIZE-OBSERVER-1]
要素の主要ボックスサイズの変化を監視するAPIを記述します。
Webアニメーション [WEB-ANIMATIONS-1]
Webページ表示の同期・タイミングモデルを定義し、そのモデルを操作するAPIも定義します。
CSSフォントモジュール レベル4 [CSS-FONTS-4]
CSS Fonts 3を拡張・置き換え、OpenTypeバリエーション対応などフォント選択や機能選択の制御を強化します。
CSSカラー調整モジュール レベル1 [CSS-COLOR-ADJUST-1]
ユーザーエージェントによる自動カラー調整を最適化・制御するモデルと手段を導入します。
CSS条件付き規則モジュール レベル4 [CSS-CONDITIONAL-4]
CSS Conditional 3を拡張し、サポートされているセレクターのテストを可能にします。
CSSカスケード・継承 レベル5 [CSS-CASCADE-5]
CSS Cascade 4を拡張し、カスケードレイヤーを追加します。
モーションパスモジュール レベル1 [MOTION-1]
任意のグラフィックオブジェクトを著者指定のパスに沿って配置・アニメーションできる機能を導入します。
CSSスクロールアンカーモジュール レベル1 [CSS-SCROLL-ANCHORING-1]
スクロールコンテナのスクロール位置を特定のアンカー要素にロックすることで、コンテンツのシフトを最小化します。
CSSオブジェクトモデル(CSSOM) [CSSOM-1]
CSS、メディアクエリ、セレクターの解析、シリアライズ、操作用APIを定義します。
CSSカラー モジュール レベル5 [CSS-COLOR-5]
CSS Color 4を拡張し、色空間や色修飾関数を追加します。
セレクター レベル4 [SELECTORS-4]
セレクター レベル3を拡張し、新しい疑似クラス、疑似要素、コンビネーターを導入。より複雑な条件や状態に基づく要素選択が可能になります。

2.5. CSSレベル

カスケーディングスタイルシートは従来の意味でのバージョンを持たず、代わりにレベルがあります。各CSSレベルは前のレベルを基礎に定義を洗練し、機能を追加します。より高いレベルの機能セットは下位レベルのスーパーセットであり、上位レベルで許容される挙動は下位レベルより限定的です。より高いレベルに準拠するユーザーエージェントは、下位レベルすべてにも準拠しています。

CSSレベル1
CSSワーキンググループはCSS1仕様を廃止と見なしています。CSSレベル1は、CSS1仕様で定義されたすべての機能(プロパティ、値、at規則など)を、CSS2.1仕様の構文と定義で表現したものです。CSSスタイル属性は、要素固有のスタイル属性への組み込みを定義します。
CSSレベル2
CSS2仕様は技術的にはW3C勧告ですが、勧告段階に移行した時点では候補勧告段階が未定義でした。実装経験や追加レビューによってCSS2仕様の多くの問題が明らかになったため、膨大な正誤表を拡張する代わりに、CSSワーキンググループはCSSレベル2改訂1(CSS2.1)を定義しました。両仕様に矛盾がある場合、CSS2.1が正式な定義となります。

CSS2.1が候補勧告となった時点で、実質的にCSS2と同じ安定性レベルとなり、CSS2勧告は廃止となりました。CSS2でCSS2.1から除外された機能は候補勧告段階と考えられますが、多くはCSSレベル3のワーキングドラフトに取り込まれており、その仕様がCRに到達すればCSS2の定義は廃止となります。

CSS2.1仕様CSSレベル2を定義し、CSSスタイル属性仕様が要素固有のスタイル属性への組み込みを定義します。

CSSレベル3
CSSレベル3は、CSS2.1仕様をコアとし、各モジュールごとにCSSレベル2を拡張します。各モジュールは機能追加やCSS2.1仕様の一部を置き換えます。ワーキンググループは新しいCSSモジュールがCSS2.1仕様に矛盾しないことを意図しており、機能追加と定義の精緻化のみを行います。各モジュールが完成すれば、CSS2.1+既存モジュールのシステムに組み込まれます。

このレベル以降はモジュールごとに独立してレベル分けされます(例:セレクター レベル4はCSSラインモジュール レベル3より先に完成する可能性あり)。CSSレベル2に相当しないモジュールはレベル1から開始、CSSレベル2の機能を更新するモジュールはレベル3から開始します。

CSSレベル4以降
CSSレベル4はありません。独立したモジュールはレベル4以上に達する場合がありますが、CSSという言語自体にはレベルは存在しません(「CSSレベル3」という用語は旧来の一体型バージョンとの差別化のためだけに使われます)。

2.6. CSSプロファイル

すべての実装がCSSで定義された全機能を実装するわけではありません。

過去には、ワーキンググループがいくつかのプロファイルを公開していました。これは、さまざまなユーザーエージェントのクラスがサポートすべきCSSの最小サブセットを定義することを目的としたものです。

この取り組みは中止されており、効果的・有用とは見なされなくなったため、以前定義されたプロファイルも現在は保守されていません。

注: 公式プロファイルであっても、CSSの部分的な実装は部分的な実装の前方互換構文解析規則に従う必要があります。

3. CSSの責任ある実装のための要件

以下のセクションでは、現在および将来の相互運用性を促進する形でCSSを責任ある方法で実装するための適合要件をいくつか定義します。

3.1. 部分的な実装

著者が前方互換な構文解析規則を利用してフォールバック値を指定できるようにするため、CSSレンダラーは、十分なサポートレベルがないat規則、プロパティ、プロパティ値、キーワード、その他構文要素を無効として扱い(適切に無視する)必要があります。 特に、ユーザーエージェントはサポートされていないプロパティ値のみを選択的に無視し、サポートされている値だけを単一の複数値プロパティ宣言で採用してはなりません。 いずれかの値が無効(サポートされていない値は必ず無効)と見なされる場合、CSSではその宣言全体を無視することが求められます。

3.2. 不安定・独自機能の実装

将来の安定したCSS機能との衝突を避けるため、CSSWGは不安定な機能や独自拡張の実装について、以下のベストプラクティスを推奨します:

3.2.1. 実験的・不安定な機能

W3C仕様で記述されているが相互運用性がない不安定な機能の実装は、広く一般利用向けにリリースすべきではありません。ただし、制御された環境で限定的・実験的利用にリリースすることは可能です。

なぜ? 著者・実装者が機能を実験しフィードバックを送れるようにしつつ、著者が本番Webサイトで依存してしまい、後で構文や挙動が変更された際に「ロックイン」されてしまうことを防ぎたいからです。
例えば、UAは不安定な機能を、ベータ版やテスト段階のビルドで、隠し設定フラグ、特定のテストパートナーのみ有効なスイッチ、その他依存利用を制限する方法で実験用にリリースできます。

CSS機能は、W3Cプロセスで仕様が候補勧告(CR)段階に到達するまで不安定と見なされます。 例外的な場合、CSSWGが公式に記録した決議によって、CR前の機能でも広くリリースして安全と見なされたものが追加されることもあります。 § 4 CR前でも安全な例外を参照してください。

注: ベンダーは必ずWGに明確に相談し、この点について推測してはいけません。CR前の仕様で長期間変更がない場合、それはむしろ安定しているのではなく古くなっている場合が多いです。

3.2.2. 独自・標準化されていない機能

将来のCSS機能との衝突を避けるため、CSS2.1仕様ではベンダープレフィックス付き構文 [CSS2]が、独自および実験的拡張用に予約されています。 CSS機能が閉じた環境(単一ベンダーのUAのみがアクセス可能な環境)向けであれば、それは独自拡張です。 UAは、そのような独自拡張をベンダープレフィックス付き構文のみでサポートし、Webなどのオープン環境には公開しないようにすべきです。

なぜ? プレフィックス付き構文であれば、閉じた環境で特殊な機能を提供しても将来の標準CSS追加と衝突しません。オープン環境への公開を制限することで、標準化されていない独自拡張への依存がWeb環境で発生するのを防げます。
例えば、FirefoxのXULベースUI、AppleのiTunes UI、MicrosoftのUWPアプリなどは、それぞれのUAで実装されたCSS拡張を使います。これらUAがWebコンテンツでこれら機能を利用できないようにしている限り、コンテンツが独自拡張に依存する機会はありません。

将来的にWeb上での利用を意図している機能であっても、標準化されていない場合はWebに公開すべきではありません。

3.2.3. 市場圧力と事実上の標準

ある機能が不安定(つまり仕様がまだ安定化していない)であっても、

実装者は、その機能を広く公開するビルドでプレフィックスなしで出荷しても構いません。粗い相互運用性とは、違いがあっても実装が十分に類似していて、多くのユースケースで本番Webサイトで利用可能と主観的に判断される状態です。

注:CSSWGは必ず相談し、ベンダー間の調整と各社CSS専門家による一貫性レビューを確保する必要があります。また、粗い相互運用性でも、詳細が標準化レビューで詰められていないため、エッジケース(場合によってはエッジではないケース)で痛いほどの非互換が生じやすいことに注意してください。

なぜ? 仕様が完成する前に3つ以上のブラウザがその機能を実装するほど人気なら、この規定で出荷圧力を解放できます。すでに世間に出回ってサイトが依存し始めた機能なら、「実験的」として扱い続けても意味がありません。プレフィックス無しでの出荷を認めることで、その機能が事実上標準化されたことを認識し、著者がクロスプラットフォームなコードを書くことを促進します。
3.2.3.1. 不安定機能のベンダープレフィックス化

そのような標準化過程の不安定機能をWebで本番リリース向けに公開する場合、実装はその機能についてプレフィックス付きとプレフィックスなし両方の構文をサポートすべきです。 機能が安定し、実装が相互運用可能な挙動に更新されたら、プレフィックス付き構文のサポートは削除すべきです。

なぜ? 著者がプレフィックスなし構文で全実装を対象にでき、必要なら特定実装のみを対象にして実装差を回避できるようにするためです。プレフィックスのみをサポートする段階がないことで、スタイルシートがベンダープレフィックスだけで書かれるリスクを大幅に減らせます。これにより、機能が安定した際にUAベンダーがプレフィックス構文を廃止する際、既存コンテンツの破壊リスクが低減します。また、他ベンダーのプレフィックス付き構文をサポートする必要性も減り、コンテンツがその構文に依存している場合のリスクも低減します。

著者向けに不安定機能を紹介する場合は、必ず標準的なプレフィックスなし構文で文書化し、互換性回避以外ではプレフィックス付き構文の利用を推奨しないようにしてください。

3.2.3.2. CSSのオープン性の維持

CSSという技術のオープン性を維持するために、ベンダーは自社が出荷する機能を他社実装者が自由に実装できるようにすべきです。そのため、仕様編集・テストリソースを提供して標準化を完了させ、他社がその機能を出荷する際の障害(プラットフォーム依存やライセンス制限など)を避けるよう努めてください。

3.3. CRレベル機能の実装

仕様が候補勧告(CR)段階に到達したら、実装者は仕様通りに正しく実装できているCRレベル機能についてはプレフィックスなしで実装を公開し、プレフィックス付きバリアントは公開しないようにしてください。

CSSの相互運用性を確立・維持するため、CSSワーキンググループは実験的でないCSSレンダラーに対し、CSS機能のプレフィックスなし実装を公開する前に実装報告書(必要に応じて使用したテストケースも)をW3Cに提出するよう求めています。提出されたテストケースはCSSWGによってレビュー・修正される場合があります。

テストケースと実装報告書の提出方法の詳細は、CSSワーキンググループのWebサイトhttps://www.w3.org/Style/CSS/Test/で確認できます。 質問はpublic-css-testsuite@w3.org メーリングリストに送ってください。

4. CR前でも安全な例外

以下の機能は、CSSワーキンググループによって仕様が候補勧告段階に到達する前でも広くリリースしてよいと明示的かつ積極的に認可されています。 § 3.2.1 実験的・不安定な機能も参照してください。

以下の機能は、CSSワーキンググループによって仕様が候補勧告段階に到達する前でも広くリリースしてよいと遡及的に認可されています:

5. 索引

このセクションは規定ではありません(非規定)。

5.1. 用語索引

5.2. セレクター索引

5.3. at規則索引

5.4. プロパティ索引

5.5. 値索引

6. 謝辞

特に、§ 3.2.1 実験と不安定な機能の勧告の初期ドラフトを作成したFlorian Rivoal氏に感謝します。

適合性

文書規約

適合要件は、記述的なアサーションとRFC 2119の用語の組み合わせで表現されます。規範的部分で使われる「MUST」「MUST NOT」「REQUIRED」「SHALL」「SHALL NOT」「SHOULD」「SHOULD NOT」「RECOMMENDED」「MAY」「OPTIONAL」というキーワードは、RFC 2119で説明されている通りに解釈されます。ただし、可読性のため、この仕様書ではこれらの語はすべて大文字では記載されていません。

この仕様書の本文は、明示的に非規範的であると記載された箇所、例、および注釈を除き、すべて規範的です。[RFC2119]

この仕様書の例は「例えば」という語で導入されるか、class="example"で設定され、規範文から区別されます。例:

これは情報提供的な例です。

情報提供的な注記は「Note」から始まり、class="note"で設定され、規範文から区別されます。例:

Note: これは情報提供的な注記です。

勧告は、特別な注意を促すようにスタイル付けされた規範的なセクションであり、<strong class="advisement">で区別されます。例: UAはアクセシブルな代替手段を提供しなければなりません。

適合クラス

この仕様書への適合は、3つの適合クラスについて定義されています:

スタイルシート
CSSスタイルシート
レンダラー
スタイルシートの意味を解釈し、それらを用いた文書をレンダリングするUA
オーサリングツール
スタイルシートを書くUA

スタイルシートがこの仕様書に適合するためには、このモジュールで定義された構文を用いるすべての文が、汎用CSS文法およびこのモジュールで定義された各機能の個別文法に従って有効である必要があります。

レンダラーがこの仕様書に適合するためには、スタイルシートを適切な仕様に従って解釈することに加え、この仕様書で定義されたすべての機能を正しくパースし、文書を適切にレンダリングできる必要があります。ただし、UAがデバイスの制限により文書を正しくレンダリングできない場合でも、UAが非適合となるわけではありません(例:UAはモノクロモニターで色をレンダリングする必要はありません)。

オーサリングツールがこの仕様書に適合するためには、スタイルシートをこのモジュールの汎用CSS文法および各機能の個別文法に従って構文的に正しく書き、このモジュールで記述されているスタイルシートの他のすべての適合要件を満たす必要があります。

部分的な実装

著者が前方互換のパース規則を利用してフォールバック値を割り当てられるように、CSSレンダラーは、利用可能なレベルのサポートがないat-規則、プロパティ、プロパティ値、キーワード、その他の構文要素を無効として扱い、適切に無視しなければなりません。特に、ユーザーエージェントは、単一の複数値プロパティ宣言内でサポートされていない値のみを選択的に無視し、サポートされている値だけを認めてはなりません。いずれかの値が無効とみなされる場合(サポートされていない値は必ず無効)、CSSは宣言全体が無視されることを要求します。

不安定および独自機能の実装

将来の安定したCSS機能との衝突を避けるため、CSSWGはベストプラクティスに従って不安定な機能や独自拡張を実装することを推奨します。

非実験的な実装

仕様書がCandidate Recommendation段階に到達すると、非実験的な実装が可能となり、実装者は、仕様に従って正しく実装されたことを証明できるCRレベル機能については、プレフィックスなしの実装をリリースすべきです。

CSSの相互運用性を確立・維持するため、CSSワーキンググループは、非実験的なCSSレンダラーがCSS機能のプレフィックスなし実装をリリースする前に、実装報告書(必要に応じて、その実装報告書に使ったテストケース)をW3Cに提出することを求めています。W3Cに提出されたテストケースは、CSSワーキンググループによるレビューおよび修正の対象となります。

テストケースや実装報告書の提出に関するさらなる情報は、CSSワーキンググループのウェブサイトhttps://www.w3.org/Style/CSS/Test/で参照できます。質問はpublic-css-testsuite@w3.org メーリングリストまで。

参考文献

規範参考文献

[COMPOSITING]
Chris Harrelson. 合成とブレンディング レベル1。2024年3月21日。CRD。URL:https://www.w3.org/TR/compositing-1/
[CSS-BACKGROUNDS-3]
Elika Etemad; Brad Kemper。CSS 背景および枠線モジュール レベル3。2024年3月11日。CRD。URL:https://www.w3.org/TR/css-backgrounds-3/
[CSS-BOX-3]
Elika Etemad。CSS ボックスモデルモジュール レベル3。2024年4月11日。REC。URL:https://www.w3.org/TR/css-box-3/
[CSS-CASCADE-4]
Elika Etemad; Tab Atkins Jr.。CSS カスケーディングと継承 レベル4。2022年1月13日。CR。URL:https://www.w3.org/TR/css-cascade-4/
[CSS-COLOR-4]
Chris Lilley; Tab Atkins Jr.; Lea Verou。CSS カラーモジュール レベル4。2024年2月13日。CRD。URL:https://www.w3.org/TR/css-color-4/
[CSS-COLOR-5]
Chris Lilley; 他。CSS カラーモジュール レベル5。2024年2月29日。WD。URL:https://www.w3.org/TR/css-color-5/
[CSS-CONDITIONAL-3]
Chris Lilley; David Baron; Elika Etemad。CSS 条件付き規則モジュール レベル3。2024年8月15日。CRD。URL:https://www.w3.org/TR/css-conditional-3/
[CSS-CONTAIN-1]
Tab Atkins Jr.; Florian Rivoal。CSS コンテインメントモジュール レベル1。2024年6月25日。REC。URL:https://www.w3.org/TR/css-contain-1/
[CSS-CONTAIN-2]
Tab Atkins Jr.; Florian Rivoal; Vladimir Levin。CSS コンテインメントモジュール レベル2。2022年9月17日。WD。URL:https://www.w3.org/TR/css-contain-2/
[CSS-COUNTER-STYLES-3]
Tab Atkins Jr.。CSS カウンタースタイル レベル3。2021年7月27日。CR。URL:https://www.w3.org/TR/css-counter-styles-3/
[CSS-DISPLAY-3]
Elika Etemad; Tab Atkins Jr.。CSS ディスプレイモジュール レベル3。2023年3月30日。CR。URL:https://www.w3.org/TR/css-display-3/
[CSS-EASING-1]
Brian Birtles; Dean Jackson; Matt Rakow。CSS イージング関数 レベル1。2023年2月13日。CRD。URL:https://www.w3.org/TR/css-easing-1/
[CSS-FLEXBOX-1]
Tab Atkins Jr.; 他。CSS フレキシブルボックスレイアウトモジュール レベル1。2018年11月19日。CR。URL:https://www.w3.org/TR/css-flexbox-1/
[CSS-FONTS-3]
John Daggett; Myles Maxfield; Chris Lilley。CSS フォントモジュール レベル3。2018年9月20日。REC。URL:https://www.w3.org/TR/css-fonts-3/
[CSS-FONTS-4]
Chris Lilley。CSS フォントモジュール レベル4。2024年2月1日。WD。URL:https://www.w3.org/TR/css-fonts-4/
[CSS-IMAGES-3]
Tab Atkins Jr.; Elika Etemad; Lea Verou。CSS イメージモジュール レベル3。2023年12月18日。CRD。URL:https://www.w3.org/TR/css-images-3/
[CSS-IMAGES-4]
Tab Atkins Jr.; Elika Etemad; Lea Verou。CSS イメージモジュール レベル4。2023年2月17日。WD。URL:https://www.w3.org/TR/css-images-4/
[CSS-MULTICOL-1]
Florian Rivoal; Rachel Andrew。CSS 多段組レイアウトモジュール レベル1。2024年5月16日。CR。URL:https://www.w3.org/TR/css-multicol-1/
[CSS-POSITION-3]
Elika Etemad; Tab Atkins Jr.。CSS 配置レイアウトモジュール レベル3。2024年8月10日。WD。URL:https://www.w3.org/TR/css-position-3/
[CSS-SIZING-3]
Tab Atkins Jr.; Elika Etemad。CSS ボックスサイズモジュール レベル3。2021年12月17日。WD。URL:https://www.w3.org/TR/css-sizing-3/
[CSS-SIZING-4]
Tab Atkins Jr.; Elika Etemad; Jen Simmons。CSS ボックスサイズモジュール レベル4。2021年5月20日。WD。URL:https://www.w3.org/TR/css-sizing-4/
[CSS-STYLE-ATTR]
Tantek Çelik; Elika Etemad。CSS スタイル属性。2013年11月7日。REC。URL:https://www.w3.org/TR/css-style-attr/
[CSS-SYNTAX-3]
Tab Atkins Jr.; Simon Sapin。CSS 構文モジュール レベル3。2021年12月24日。CRD。URL:https://www.w3.org/TR/css-syntax-3/
[CSS-TEXT-4]
Elika Etemad; 他。CSS テキストモジュール レベル4。2024年5月29日。WD。URL:https://www.w3.org/TR/css-text-4/
[CSS-TRANSFORMS-1]
Simon Fraser; 他。CSS トランスフォームモジュール レベル1。2019年2月14日。CR。URL:https://www.w3.org/TR/css-transforms-1/
[CSS-TRANSFORMS-2]
Tab Atkins Jr.; 他。CSS トランスフォームモジュール レベル2。2021年11月9日。WD。URL:https://www.w3.org/TR/css-transforms-2/
[CSS-UI-3]
Tantek Çelik; Florian Rivoal。CSS 基本ユーザーインターフェースモジュール レベル3 (CSS3 UI)。2018年6月21日。REC。URL:https://www.w3.org/TR/css-ui-3/
[CSS-VALUES-3]
Tab Atkins Jr.; Elika Etemad。CSS 値と単位モジュール レベル3。2024年3月22日。CRD。URL:https://www.w3.org/TR/css-values-3/
[CSS-VARIABLES-1]
Tab Atkins Jr.。CSS カスタムプロパティ(カスケーディング変数)モジュール レベル1。2022年6月16日。CR。URL:https://www.w3.org/TR/css-variables-1/
[CSS-WILL-CHANGE-1]
Tab Atkins Jr.。CSS Will Change モジュール レベル1。2022年5月5日。CRD。URL:https://www.w3.org/TR/css-will-change-1/
[CSS-WRITING-MODES-3]
Elika Etemad; Koji Ishii。CSS 書記モード レベル3。2019年12月10日。REC。URL:https://www.w3.org/TR/css-writing-modes-3/
[CSS2]
Bert Bos; 他。カスケーディングスタイルシート レベル2 改訂1 (CSS 2.1) 仕様。2011年6月7日。REC。URL:https://www.w3.org/TR/CSS21/
[CSS3-MEDIAQUERIES]
Florian Rivoal。メディアクエリー レベル3。2024年5月21日。REC。URL:https://www.w3.org/TR/mediaqueries-3/
[CSS3-NAMESPACE]
Elika Etemad。CSS 名前空間モジュール レベル3。2014年3月20日。REC。URL:https://www.w3.org/TR/css-namespaces-3/
[RFC2119]
S. Bradner。RFCで要件レベルを示すキーワードの使い方。1997年3月。Best Current Practice。URL:https://datatracker.ietf.org/doc/html/rfc2119
[SELECTORS-3]
Tantek Çelik; 他。セレクター レベル3。2018年11月6日。REC。URL:https://www.w3.org/TR/selectors-3/
[SELECTORS-4]
Elika Etemad; Tab Atkins Jr.。セレクター レベル4。2022年11月11日。WD。URL:https://www.w3.org/TR/selectors-4/

参考情報

[CSS-ALIGN-3]
Elika Etemad; Tab Atkins Jr.. CSS ボックスアライメントモジュール レベル3。2023年2月17日。WD。URL: https://www.w3.org/TR/css-align-3/
[CSS-ANIMATIONS-1]
David Baron; 他。CSS アニメーション レベル1。2023年3月2日。WD。URL: https://www.w3.org/TR/css-animations-1/
[CSS-BREAK-3]
Rossen Atanassov; Elika Etemad。CSS フラグメンテーションモジュール レベル3。2018年12月4日。CR。URL: https://www.w3.org/TR/css-break-3/
[CSS-CASCADE-3]
Elika Etemad; Tab Atkins Jr.. CSS カスケーディングと継承 レベル3。2021年2月11日。REC。URL: https://www.w3.org/TR/css-cascade-3/
[CSS-CASCADE-5]
Elika Etemad; Miriam Suzanne; Tab Atkins Jr.. CSS カスケーディングと継承 レベル5。2022年1月13日。CR。URL: https://www.w3.org/TR/css-cascade-5/
[CSS-COLOR-3]
Tantek Çelik; Chris Lilley; David Baron。CSS カラーモジュール レベル3。2022年1月18日。REC。URL: https://www.w3.org/TR/css-color-3/
[CSS-COLOR-ADJUST-1]
Elika Etemad; 他。CSS カラー調整モジュール レベル1。2022年6月14日。CRD。URL: https://www.w3.org/TR/css-color-adjust-1/
[CSS-CONDITIONAL-4]
David Baron; Elika Etemad; Chris Lilley。CSS 条件付き規則モジュール レベル4。2022年2月17日。CR。URL: https://www.w3.org/TR/css-conditional-4/
[CSS-FONT-LOADING-3]
Tab Atkins Jr.. CSS フォントローディングモジュール レベル3。2023年4月6日。WD。URL: https://www.w3.org/TR/css-font-loading-3/
[CSS-GRID-1]
Tab Atkins Jr.; 他。CSS グリッドレイアウトモジュール レベル1。2020年12月18日。CRD。URL: https://www.w3.org/TR/css-grid-1/
[CSS-GRID-2]
Tab Atkins Jr.; Elika Etemad; Rossen Atanassov。CSS グリッドレイアウトモジュール レベル2。2020年12月18日。CRD。URL: https://www.w3.org/TR/css-grid-2/
[CSS-LISTS-3]
Elika Etemad; Tab Atkins Jr.. CSS リストとカウンターモジュール レベル3。2020年11月17日。WD。URL: https://www.w3.org/TR/css-lists-3/
[CSS-LOGICAL-1]
Rossen Atanassov; Elika Etemad。CSS 論理プロパティと値 レベル1。2018年8月27日。WD。URL: https://www.w3.org/TR/css-logical-1/
[CSS-MASKING-1]
Dirk Schulze; Brian Birtles; Tab Atkins Jr.. CSS マスキングモジュール レベル1。2021年8月5日。CRD。URL: https://www.w3.org/TR/css-masking-1/
[CSS-SCROLL-ANCHORING-1]
Tab Atkins Jr.. CSS スクロールアンカリングモジュール レベル1。2020年11月11日。WD。URL: https://www.w3.org/TR/css-scroll-anchoring-1/
[CSS-SCROLL-SNAP-1]
Matt Rakow; 他。CSS スクロールスナップモジュール レベル1。2021年3月11日。CR。URL: https://www.w3.org/TR/css-scroll-snap-1/
[CSS-SCROLLBARS-1]
Tantek Çelik; Rossen Atanassov; Florian Rivoal。CSS スクロールバーのスタイリングモジュール レベル1。2021年12月9日。CR。URL: https://www.w3.org/TR/css-scrollbars-1/
[CSS-SHAPES-1]
Rossen Atanassov; Alan Stearns。CSS シェイプモジュール レベル1。2022年11月15日。CRD。URL: https://www.w3.org/TR/css-shapes-1/
[CSS-SPEECH-1]
Léonie Watson; Elika Etemad。CSS スピーチモジュール レベル1。2023年2月14日。CRD。URL: https://www.w3.org/TR/css-speech-1/
[CSS-TEXT-3]
Elika Etemad; Koji Ishii; Florian Rivoal。CSS テキストモジュール レベル3。2024年9月30日。CRD。URL: https://www.w3.org/TR/css-text-3/
[CSS-TEXT-DECOR-3]
Elika Etemad; Koji Ishii。CSS テキストデコレーションモジュール レベル3。2022年5月5日。CRD。URL: https://www.w3.org/TR/css-text-decor-3/
[CSS-TRANSITIONS-1]
David Baron; 他。CSS トランジション。2018年10月11日。WD。URL: https://www.w3.org/TR/css-transitions-1/
[CSS-VIEW-TRANSITIONS-1]
Tab Atkins Jr.; Jake Archibald; Khushal Sagar。CSS ビュートランジションモジュール レベル1。2024年3月28日。CRD。URL: https://www.w3.org/TR/css-view-transitions-1/
[CSS-WRITING-MODES-4]
Elika Etemad; Koji Ishii。CSS 書記モード レベル4。2019年7月30日。CR。URL: https://www.w3.org/TR/css-writing-modes-4/
[CSSOM-1]
Daniel Glazman; Emilio Cobos Álvarez。CSS オブジェクトモデル (CSSOM)。2021年8月26日。WD。URL: https://www.w3.org/TR/cssom-1/
[FILTER-EFFECTS-1]
Dirk Schulze; Dean Jackson。フィルター効果モジュール レベル1。2018年12月18日。WD。URL: https://www.w3.org/TR/filter-effects-1/
[MEDIAQUERIES-4]
Florian Rivoal; Tab Atkins Jr.. メディアクエリ レベル4。2021年12月25日。CRD。URL: https://www.w3.org/TR/mediaqueries-4/
[MOTION-1]
Tab Atkins Jr.; Dirk Schulze; Jihye Hong。モーションパスモジュール レベル1。2024年11月5日。WD。URL: https://www.w3.org/TR/motion-1/
[RESIZE-OBSERVER-1]
Aleks Totic; Greg Whitworth。リサイズオブザーバー。2020年2月11日。FPWD。URL: https://www.w3.org/TR/resize-observer-1/
[WEB-ANIMATIONS-1]
Brian Birtles; 他。ウェブアニメーション。2023年6月5日。WD。URL: https://www.w3.org/TR/web-animations-1/