コメント：HTML5変換により、プレースホルダー、ダウンロード、非表示など、非常に有用な新しい属性がたくさんあります。新しい属性は、新しい制御方法とページ要素に制御効果をもたらします。
特に、複数の要素のプロパティを制御できる新しい属性、つまりスコープがあります。スタイルタグに新しく表示されたスコープ属性は、CSSスタイルをローカル要素でのみ効果的にすることができます。具体的には、このスタイルを保存する要素の子要素が有効になります。通常のスタイルとの唯一の違いは、新しいスコープ属性が追加されることです。
<スタイルスコープ>
/ *スタイルはこちらに行きます */
</style>
スコープ属性のあるスタイルは、現在の要素とその子供にのみ適用されます。インラインスタイルは、スコープスタイルよりも優先度が高いため、インラインスタイルの使用を避けることをお勧めします。ここにいくつかのスタイルが組み合わされています。効率の範囲を比較してください。
<div>
<スタイルスコープ>
div {border：1px Solid Green;マージンボトム：20px; Min-Height：40px; }
.democontain {background：＃f8f8f8; }
</style>
<div> </div>
<div>
<スタイルスコープ>
div {background：lightblue;ボーダー：1pxソリッドブルー; }
</style>
<div> </div>
</div>
<div> </div>
</div>
スコープスタイルでは、このようなメディアクエリなどのリーガルCSSスタイルのタグを使用できます。
<スタイルスコープ>
@mediaのみの画面と（max-width：1024px）{
div {背景：＃000; }
}
</style>
この新たなスコーププロパティは、特にテンプレート、CMSユーザー、またはスタイルファイル全体を操作できない開発者を作成する人にとって非常に便利です。ただし、一部の古いブラウザはこのプロパティをサポートしていないことに注意する必要があります。この場合、jQueryプラグイン（https://github.com/thingsinjars/jquery-scoped-css-plugin）を使用して、この問題を補う必要があります。