1

私は1つの一般的なCSSファイルを持っており、2つのページがそれを参照しています。

この一般的なCSSを参照している1つのページには、以下のCSSが必要です。

*:first-child + html .rich-tabpanel {
   margin-left:-13px;        // Note : Its 13px here
}

この一般的なCSSを参照している他のページには、以下のCSSが必要です。

*:first-child + html .rich-tabpanel {
   margin-left: 0px;         //Note : Its 0px here 
}

HTMLコードは以下のとおりです。

<table class="rich-tabpanel">

私はIE7でのみこの問題を抱えており、以下のコードを取得していません（理由はわかりません）、

.ie7 .rich-tabpanel {
   margin-left: 13px; //OR 0px depending on the page
}

だから、私は上記のコードを削除し、コードだけで行きまし*:first-child + html .rich-tabpanelた

margin-left属性の同じ共通CSSファイルに2つの異なる属性を含めるにはどうすればよいrich-tabpanelですか？

4

2 に答える 2

1

現時点*:first-child +html .rich-tabpanelではハッキングであり、その特異性は不明です。.ie7 .rich-tabpanel具体性は0020なので、ハックはおそらくそれ以上の具体性を持っています。仕様を変更するセレクター.ie7 .rich-tabpanelをhtml .ie7 .rich-tabpanel変更すると、ルールが適用されます。これが特異性の問題であるとは限りませんが、セレクターを変更すると、いずれにしても機能します。

デモ: http://jsfiddle.net/xWX2R/1/

いずれにせよ、Internet Explorer のハックよりも条件付きコメントを使用することをお勧めします。

于 2013-01-02T12:01:43.033 に答える
0

まず、なぜこの CSS スタイルを適用しているのか混乱しています。

*:first-child +html .rich-tabpanel{
    margin-left:-13px;        // Note : Its 13px here
}

具体的には、何*:first-child +html .rich .rich-tabpanel1を意味するのですか？

「すべての要素を選択し、最初の子を選択し、次に隣接するタグを選択し、.rich-tabpanel1 を選択します」と書かれていることを読んだとき。これを行うためのより良い方法は確かにあります：

.rich-tabpanel1 { 
  //code 
}

コードに問題はありません。1 つのページは最初のコード ブロックを参照でき、2 番目のページは他のコード ブロックを参照できます。ただし、このコード:

.ie7 .rich-tabpanel {
   margin-left: 13px; //OR 0px depending on the page
}

.ie7html にクラスを具体的に追加しない限り、機能しません。サーバー側スクリプトを使用してそのクラスを html マークアップに追加していますか? これを行うためのより良い方法は次のとおりです。

<!--[if IE]>
  <style type="text/css">@import url("ie.css");</style>
<![endif]-->

IE ブラウザの場合、この CSS ファイルが取得され、css プロパティをオーバーライドするために使用されます。これにより、スタイリングをより細かく制御できます。

于 2013-01-02T11:42:36.500 に答える