1

異なる色の1つの要素に2つのスタイルを設定することは可能ですか？

言い換えると、次のHTMLコードがあるとします。

<table class='my_table'>
<th class="style1 style2">LastName</th>
...
</table>

および次のCSS：

.my_table th.style1 { 
    background: #aaaaaa; 
}

.my_table th.style2 { 
    background: #bbbbbb; 
}

条件によっては、JavaScriptを使用して1つのスタイルを削除できることを理解しています。しかし、私は2つのスタイルが欲しいので、そのうちの1つは別のスタイルをオーバーライドする必要があります。それは可能ですか？

4

7 に答える 7

1

質問に答えるには、最後に定義したスタイル（クラス属性のクラスではない）を要素に適用する必要があります。しかし、どこかで！importantキーワードが使用された場合、結果は非常に奇妙になる可能性があります。

于 2012-11-28T19:59:56.243 に答える
1

はい、要素には任意の数のクラスを使用できます。CSSは、宣言の順序とセレクターの特異性の両方を使用して、どちらをオーバーライドするかを決定します。

たとえば、特異性が同じである場合、最後のものが使用されます。

.style1 { 
    background: #aaaaaa; 
}

.style2 { 
    background: #bbbbbb; 
}

それ以外の場合は、最も具体的なものが使用されます（以下の例の最初のもの）。

.my_table th.style1 { 
    background: #aaaaaa; 
}

.style2 { 
    background: #bbbbbb; 
}
于 2012-11-28T20:02:55.157 に答える
1

はい、要素に複数のクラスを使用でき、それらのクラスのすべてのスタイルルールが適用されます。

ルールが競合する場合、最も具体的なルールが他のルールを上書きします。ルールが同じように具体的である場合、最後のルールが適用されます。

例：

<table class="my_table">
    <tr>
        <th class="style1">Style 1</th>
        <th class="style2">Style 2</th>
        <th class="style1 style2">Style 1 and 2</th>
    </tr>
</table>

3番目のセルはstyle2、スタイルシートの最後に定義されているため、から背景を取得します。

デモ： http： //jsfiddle.net/jsLP5/

于 2012-11-28T20:04:18.730 に答える
0

はい、要素に複数のクラスを適用できます。同じCSS要素に対して競合する定義がある場合、一方が他方をオーバーライドします。

于 2012-11-28T19:58:18.070 に答える
0

一般的に、または特定の要素に対して、必要な数のスタイル定義を設定できます。どちらを使用するかは、cssの特異性（スコープ）に基づいています。あなたはここでもっと読むことができます：http：//coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/

于 2012-11-28T19:59:27.993 に答える
0

あなたなら出来る

       <th class="style1 style2">LastName</th>

そしてcssはここで説明されているようにあなたのものです

http://webdesign.about.com/od/css/qt/tipcssmulticlas.htm

于 2012-11-28T19:59:35.863 に答える
0

与えられたコードでは、使用される背景色は#bbbbbbです。これは、他の条件が同じであるため、ここにあるように、カスケードルールによって後者の宣言が優先されます。これは、CSS宣言の順序を意味します。属性内のクラス名の順序classは重要ではありません。

于 2012-11-28T20:03:34.750 に答える