1

ブラウザーベースの Web サイトビルダーを表示するために、Web サイトの上に CSS を「オーバーレイ」する Squarespace のユーザーインターフェイスを変更する Chrome 拡張機能を作成しています。

これが私の体のCSSだとしましょう：

body {
 background-color: #000000;
 background-image: url("/storage/body.jpg");
 background-repeat: no-repeat;
 background-position: top center;
}

Squarespace のユーザー インターフェイスを開くと、インライン スタイルでいくつかのクラスが CSS に追加されます。したがって、これは私のコードに自動的に追加されます:

{
padding-top: 56px;
background-position: 50px 56px;
}

したがって、CSS Chrome 拡張機能を使用してユーザー インターフェイスを変更しているので、これらのインライン スタイルの追加を本質的に「スキップ」または「無効」にしたいと考えています。拡張 CSS で !important を使用することもできますが、一部の Web サイトでは別の background-position を使用する場合があります。私の延長で。また、他のスタイリングにも使用されるため、スクリプトを使用してクラスを単純に削除したくありません。

ありがとう！

4

1 に答える 1

5

絶対にインライン スタイルを保持する必要がある場合 (たとえば、スタイルを外部のスタイル シートに移動したり、<style>少なくとも<head>.

myElement
{
    background-position: center !important;
}

これは文字通り、それを行う唯一の CSS 方法です。

JavaScript を使用して要素の属性を見つけ、必要に応じて変更すること!importantもできますが、CSS でインライン スタイルをオーバーライドできるのは JavaScript だけです。

:)

http://jsfiddle.net/Kyle_Sevenoaks/TXmC7/

于 2011-11-21T13:25:50.723 に答える