角度のようなフレームワークはコンポーネント内でCSSをどのように含んでいますか？

実際の問題を解決するのではなく、もっと興味深い質問があります。角度のようなフレームワークはコンポーネント内でCSSをどのように含んでいますか？

角度のようなフレームワークはコンポーネント内のCSSをどのように含み、CSSがページ全体に漏れるのを防ぎますか？

2016-06-29 tt_Gantz

http://blog.thoughtram.io/angular/2015/06/29/shadow-dom- strateg-in-angular2.html – haim770

あなたが探しているものかどうかは分かりませんが、常にクラスオプションがあります。たとえば、ブートストラップボタンを使いたかったので、すべてのボタンに 'class =" btn btn-default "が付きました。これを持っていないすべてのボタンは、「通常の」ボタンになります.. – bene

ShadowDOM：https://scotch.io/tutorials/all-the-ways-to-add-css-to-angular-2-components – mondjunge

角度2は、コンポーネント内に含まれるCSSを可能ShadowDOM概念を使用します。

デフォルトでは、Angular 2は "エミュレーション"を使用します。つまり、ShadowDOMの実装をエミュレートすることで、古いブラウザで動作する可能性が高くなります。ネイティブブラウザの実装を使用するように設定できます（ただし、ブラウザがサポートしている場合のみ機能します）。

注釈として、ShadowDOMは角度2で完全にオフにすることができ、CSSは期待どおりにリークします。

出典

2016-06-29 06:41:34

デフォルトではViewEncapsulation.Emulatedすべてのコンポーネントについて、<head>にCSSが追加されています。コンポーネントタグとそのテンプレート内の要素に一意のCSSクラスが追加され、スタイルのセレクタは、スタイルが追加された特定のコンポーネントにのみ一致するように、<head>に追加される前にAngular2によって書き換えられます。

ネイティブのシャドーDOMをサポートするブラウザにViewEncapsulation.Nativeを使用すると、スタイルはコンポーネントに直接追加されます。ブラウザにネイティブシャドーDOMサポートがなく、ポリコンポーネントがロードされているWebコンポーネントの場合、Angular2と同様に動作しますViewEncapsulation.Emulated

出典

2016-06-29 07:28:26

角度のようなフレームワークはコンポーネント内でCSSをどのように含んでいますか？

答えて

関連する問題