11

複雑な CSS を使用するウィジェットがあり、すべてが CSS を持つ複数の Web サイトに埋め込む必要があるとします。

すべてのウィジェットの CSS ルールに「#widget」というプレフィックスを付けると、それらは外側の何にも適用されないため、1 つの問題が修正されました。残念ながら、サイトの CSS ルールがウィジェットを台無しにする可能性があります。

#widget 内のすべての CSS を適切なリセット ルールでリセットすると、外部のすべてのルールが上書きされることを願っています。(私のルールは #id を使用し、外部のルールはウィジェット内の ID を認識しないため、それらをオーバーライドすることはできませんよね?!重要にもかかわらず)

すべての CSS を既知の状態にリセットする最良の方法は何ですか? ほとんどの CSS リセットはブラウザのデフォルトから開始され、任意の CSS はリセットされません。何があっても機能する CSS リセットはありますか?

4

4 に答える 4

13

同じ問題を解決しようとしているときに、cleanslate.css に遭遇しました。

https://github.com/premasagar/cleanslate

まだ実稼働環境では使用していませんが、BBC World Service ウィジェットの開発から生まれたようです。

于 2009-12-20T21:52:14.393 に答える
1

はい、cssはウィジェットの外部で宣言されたものをすべてオーバーライドする必要がありますが、リセットは非常に包括的である必要があります。の修正バージョンを使用することをお勧めしますhttp://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ですが、すべてのセレクターを自分で変更する必要があります。

セレクターも強化したくなるので、

#widget tagname{}

使用する

html body #widget tagname{}

これで、セレクターの重みがはるかに高くなります。

于 2009-10-09T11:59:46.637 に答える
1

名前空間を使用 & リセット & LESS

#my-ns {
  @import ".../reset.less";

  ... your other styles ...
}
于 2012-07-11T22:26:43.313 に答える
0

CSS スタイルをリセットするには、Eric Meyer の reset reloaded を使用します。リンク: http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/

于 2009-10-09T11:52:59.833 に答える