問題タブ [css-specificity]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
4 に答える
807 参照

css - 特異性は高いがCSSを無視するIE

スライドドアのボタンcssがいくつかあります。ボタンタグと2つの内側のスパンを使用しています。

通常のボタンの背景画像を指定するためにこれを持っています。

これはデフォルトのボタンの色です。次に、「灰色」ボタンがあります(ボタンに「灰色」のクラスを指定します)。

何らかの理由で..IE(8)はこれを嫌い、元の画像を背景として保持している灰色のcssを無視します。ただし、次の「ホバー」cssはIEでは機能します。

「button.grayspan」は「buttonspan」よりも特異性が高いと思いました(他のすべてのブラウザでそうです)。

編集:わかりました、それで私は問題を発見しました。私のCSS宣言では、次のようになりました

button:disabled spanを宣言リストから削除すると、機能します。

0 投票する
4 に答える
1559 参照

jquery - jquery : 背景色を保持するクラスを持つセルを除くテーブルの行の色を交互に

私はjqueryが初めてです。私は自分のコードにこれを持っています:

CSSで:

テーブルにセルがあります

現在、他のすべての行コマンドは my class="coloron" に乗っています。

他のすべての行に色を付けながら、セルの一意の色を維持するにはどうすればよいですか?

0 投票する
9 に答える
99284 参照

html - CSS で「!important」を使用すると、どのような影響がありますか?

私は数か月間ウェブサイトで作業してきましたが、何かを編集しようとしているときは、多くの場合、次のように使用する必要が!importantあります

期待どおりに表示させるためです。これは悪い習慣ですか?または、!importantコマンドを使用しても問題ありませんか? これにより、さらに望ましくないことが発生する可能性はありますか?

0 投票する
3 に答える
11132 参照

css - !important なしで CSS クラス セレクターを上書きする

Web アプリ用の JavaScript UI ダイアログを作成しています。問題は、ユーザーが Web アプリ用の独自のテーマを作成できることです。これh1 {...}, div {...}には、UI ダイアログの CSS 書式設定を上書きする要素 CSS セレクター (など) が含まれる場合があります。ダイアログは、クラス セレクターでフォーマットされた div 要素です (このダイアログは複数回表示される可能性があるため、id は機能しません)。巨大な CSS リセット スタイルを使用せずに、!importantUI ダイアログのすべてのスタイルに使用することなく、UI ダイアログに影響を与えるユーザー テンプレート スタイルの要素セレクターを停止する方法はありますか? ダイアログボックスでjQuery UIスタイルのようなUIライブラリをどのように使用しますか?

たとえば、ユーザー テーマには次のものが含まれます。

UI の css:

UI の html:

問題は、.ui_modal_wrap に巨大な css レストを使用する必要があることです。これは、ユーザーが適用できるすべての属性を含む css を実際に記述できないためです (この例では、UI に含まれていないため、高さと幅の要素によってスタイルが崩れます)。高さと幅)。

0 投票する
7 に答える
1501 参照

css - CSS の特異性に関するベスト プラクティスは?

いくつかの異なるサイトに含まれるお問い合わせフォームを作成しています。

お問い合わせフォームのスタイルとサイトのスタイルの両方が含まれますが、サイトのスタイルはよくわかりません。連絡先フォームのスタイルがサイトのスタイルによって簡単に上書きされることを望んでいますが、連絡先フォームのスタイルが誤って上書きされることは望ましくありません。

たとえば、サイト開発者が送信ボタンの色を変更したい場合、!important過度に特殊な#id #id element .class #id element.classタイプのセレクターを使用せずに簡単に行う必要があります。

しかし、一方、サイト開発者がセレクターを使用してスタイルを作成した場合、input { background: yellow; }または#site-wrapper input { background: yellow; }クラスを参照するコンタクトフォームのスタイルを上書きしたくない場合は、.contact_input { background: white; }

私の質問は、この状況でのベストプラクティスは何ですか? フォームにIDを付けて、それをすべてのセレクターに追加することを考えていたので、セレクターはなり#contactform .contact_input { background: white; }、競合を回避するという点ではうまくいくと思いますが、それを行うためのより良い方法があるかどうか疑問に思っています。ページのレンダリングに関しては、少し効率が悪いようです。大したことではないかもしれませんが、私はそれをそこに投げ出して、人々がどう思うか見てみようと思いました.

0 投票する
2 に答える
24136 参照

html - この要素IDをCSSで具体的にターゲットにするにはどうすればよいですか?

CSSセレクター#checkout form.centerをすでに使用しています

特に確認フォームのためにこれを上書きしたいのですが、私が書き込もうとしていることはどれも適用されません。か何かが最初のルールに取って代わるべきだと思うべき#confirmation form.centerですが、それは目標を達成していないようです。#confirmation上記のセレクターはそれほど具体的ではないため、オーバーライドされます。

0 投票する
1 に答える
1617 参照

css - CSS !重要なルールの使用、具体性

私は、Wordpress プラグインの作成に使用される PHP クラスの束を作成していますが、他の環境でも使用できます。スクリプトを単独でテストしたところ、すべて問題ないように見えましたが、スクリプト用の WP プラグインを作成したときに、予見していた CSS の競合が発生しました。私は当初、これらを解決するために特異性を使用することを計画していましたが、常に実行できるとは限りません。これはデフォルトの WP テーマにあります。

パディングなしで td を指定しようとしても、クラスではなく ID をテーブルに追加しない限り機能しません。具体性のために ID を使用するのではなく、すべての CSS プロパティに !important ルールを実装する人気のあるプラグインを見てきました。どれが最高ですか?!important ルールは慎重に使用する必要があることはわかっていますが、同じ ID を持つこのテーブルの複数のインスタンスが存在するため、テーブルに ID を追加することはセマンティクスに反するようです。

ドキュメント言語の ID 属性により、作成者はドキュメント ツリー内の 1 つの要素インスタンスに識別子を割り当てることができます。

http://www.w3.org/TR/CSS2/selector.html#id-selectors

編集: ID を使用して div 内のすべてをラップすることもできますが、#content #main td などのルールが存在する場合、#someid td よりも優先されます。また、以下で説明するように、2 つの要素が同じ ID を共有することは有効ではありませんが、「機能する」場合があります。

0 投票する
1 に答える
1757 参照

javascript - 特異性に基づいてCSSセレクターのセットをソートする

JS関数のCSSの特異性に基づいて、CSSセレクターのセットをどのように並べ替えることができますか?

0 投票する
3 に答える
357 参照

html - 特異性 CSS の問題

具体性の問題を抱えた CSS で狂ってしまう。HTML。

.css

私が抱えている問題は、別の div css の代わりに page_left css を使用し続けているため、ページが奇妙に見えることです。

0 投票する
4 に答える
4284 参照

css - cssプロパティのオーバーライド

私のHTMLは次のようなものです。

外部スタイルシートでこのような「別の」クラスを使用して、上記のスタイルを定義しました。

次のように、「addAnother」クラスを使用してタグのスタイルをオーバーライドしようとしています(必要な場合)。

しかし、私はオーバーライドすることができません。どんな助けでも大歓迎です。

スタイルをオーバーライドする間、セレクターは同じでなければならないという規則はありますか(私はこれを試しましたが、役に立ちませんでした)??