1

ページでは、独自のスタイルシートを持つタブストリップを使用しています。このタブストリップは、div とアンカーで記述されています。

他のいくつかの div をタブに追加しますが、それらは外側のタブストリップからスタイルシートを継承します。この新しい div には独自の css クラスがあります。

これが私の質問です。css の構造を変更せずにこの継承を破る方法はありますか?

タブの CSS スタイル:

div.tabs {
    padding: .5em;
}
div.tabs div.tabs {
    padding: 0;
}
div.tabs div.tabs div {
    clear: left;
    height: 4em;
    padding: .5em;
    border: 1px solid #003366;
}

新しく追加された div は、このクラスを使用します:

.graphTextItem{ font-family:sans-serif; font-size:12px; border: solid 1px #78ACFF; text-align:center; width:150px; }
.graphImageItem{ border-left: solid 1px #78ACFF; border-right: solid 1px #78ACFF; text-align:center; height:70px; }
4

4 に答える 4

4

すべての div ではなく、ネストされたレベルごとに異なる要素を使用してみることができます。

<div>
   <ul>
      <li></li>
   </ul>
</div>

上記の例では、 のスタイルを設定することができdiv、いずれulにliせよ必要に応じて個別にターゲットにしてスタイル ルールを適用することができます。継承は問題ありません。

于 2009-04-15T01:09:02.840 に答える
2

最も具体的なクラスで継承する必要のない各要素をオーバーライドします。

たとえば、.graphTextItem では、高さとパディングをオーバーライドします。

于 2009-04-14T12:35:45.570 に答える
2

あまり。継承は CSS の一部です。特定の値が必要な場合は、それを指定します。

于 2009-04-14T12:37:07.547 に答える
0

このスタイルシートからdivを削除することで、私の問題は解決しました:

div.tabs div.tabs {
    clear: left;
    height: 4em;
    padding: .5em;
    border: 1px solid #003366;
}

しかし、方法があるかどうかはまだ疑問です。

于 2009-04-14T12:42:15.617 に答える