スコープ付きスタイルシートの適用方法は？

適用可能な方法はありますかbootstrap.cssdiv要素にのみありますか？例：私のグローバルクラステキスト危険が定義されていますが、#wrapperの場合はboostrap.cssを適用したいと思います。したがって、。テキストの危険は今すぐの色にする必要があります：＃a94442;あなたはサイト全体に繰り返しクラスのインラインスタイル（）スコープ付きスタイルシートの適用方法は？

をしたいと思う唯一の要素について

<style> 
.text-danger { 
    color:blue; 
} 
</style> 

<div id="wrapper"> 
    <style scoped> 
    @import url("http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"); 
    </style> 

    <p class="text-danger">Some random text</p> 
</div> 

<p class="text-danger">Outer text</p>

出典

2016-09-05 que1326

1つの要素に対してフレームワーク全体をインポートしたいですか？ちょうどクラスを抽出し、あなた自身のCSSに追加してください –

残念なことにscoped CSSはFirefoxでのみサポートされています - 1つのdivの全体ライブラリを含めるのは少し重いようですが – Pete

@DarrenSweeney：これはマイナーな例です特定の部分にブートストラップを適用する（div要素など） – que1326

あなたのコメントに基づいて、scoped cssはfirefoxでしかサポートされていないので、あなたのdivをクラスに与えます（例えば、ハッキーなビットですが、bootstrap-stylesなど）。あなたはこのより

他のクラス内のすべてのブートストラップスタイルをラップすることができますとしてのCSSファイルは、あなたがより少ないか、SASSのようなCSSプロセッサのいくつかの並べ替えを使用している場合、これは非常に簡単になります

各スタイルの前に.bootstrap-stylesを置きますjQueryソリューションをお試しください：https://github.com/thingsinjars/jQuery-Scoped-CSS-plugin

出典

2016-09-05 10:16:17 Pete

jQueryソリューションは動作しません。codepenでテストされています。 – que1326

https://jsfiddle.net/mfr0mogx/（私は@import部分を試していませんでしたが） – Pete

うまくいきなり、最終的に私はそれをラップして、ホストまたはローカルのcssファイルに保存しました。情報をありがとう！！ – que1326

、あなた自身のカスタムCSS/SCSSファイルにそのクラスのスタイリングを抽出し、含める必要がありますそれ。

出典

2016-09-05 10:09:10 FedeSc

スコープ付きスタイルシートの適用方法は？

答えて

関連する問題