HTML5 の "scoped" 属性の現在の状態 の "scoped" 属性要素は、スタイルの範囲を特定の親要素とその子孫に制限するために HTML5 で提案されました。この属性は、意図しないグローバル スタイルの問題を防ぐことを目的としています。しかし、その実装は課題に直面し、最終的には仕様から削除されました。</p> <p><strong>W3C 解釈</strong></p> <p>W3C 文書の解釈は部分的には正しかったです。当初の提案では 2 種類の <style> を想定していました。要素:</p> <ul> <li> <strong>グローバル <style>:</strong> <head> 内で使用されます。 </li> <li> <strong>スコープ付き <style>:</strong> 「スコープ付き」属性を使用して本文内で使用され、最初の子として配置され、スタイルを親要素に制限します。 </li> </ul> <p><strong>現在のステータス (2023)</strong></p> <p>現在、スコープ属性は主要なブラウザーではサポートされていません。 要素はドキュメント内のどこにでも出現でき、そのスタイルはグローバルに適用されるため、予期しない動作が発生する可能性があります。ベスト プラクティスは、明示的なセレクター (ID やクラスなど) を使用して、ドキュメントの特定の要素または領域をターゲットにすることです。</p> <p><strong>将来の見通し</strong></p> <p>具体的な計画はありません近い将来、スコープ付き属性を復活させます。明示的なセレクターを使用し、異なるスタイルシート間で適切な分離を確保するという現在のアプローチは、引き続きスコープ付きスタイルを実装するための推奨される方法です。</p>
