1

#originalTable に関連付けられた css を #newTable に適用したいと考えています。

ほとんどのスタイルは class .general に関連付けられますが、私が困惑したのは ID 固有のスタイルです。#originalTable は DOM に残るので、ID だけを移動することはできません。ほとんどのスタイルは通常クラス .general. また、#newTable または #newTable に適用される新しいクラスのスタイル シートでルールを複製したくありません。

これはどのように達成できますか？ありがとうございました

CSS

.general {//some CSS}
.general thead {//some CSS}
.general thead th {//some CSS}

#originalTable {//some CSS}
#originalTable thead {//some CSS}
#originalTable thead th  {//some CSS}

HTML

<table id="originalTable" class="general">
    <thead>
        <tr>
            <th>H1</th>
            <th>H2</th>
            <th>H3</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>B1</th>
            <th>B2</th>
            <th>B3</th>
        </tr>
    </tbody>
</table>

<table id="newTable" class="general">
    <thead>
        <tr>
            <th>H1</th>
            <th>H2</th>
            <th>H3</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>B1</th>
            <th>B2</th>
            <th>B3</th>
        </tr>
    </tbody>
</table>
4

3 に答える 3

2 
#originalTable, #newTable {//some CSS}
#originalTable thead, #newTable thead {//some CSS}
#originalTable thead th, #newTable thead th  {//some CSS}
于 2012-11-12T19:30:30.490 に答える
0

コードを次のように変更する必要があります。

CSS:

.general {//some CSS}
.general thead {//some CSS}
.general thead th {//some CSS}

.originalTable {//some CSS}
.originalTable thead {//some CSS}
.originalTable thead th  {//some CSS}

HTML:

<table class="general">
    <thead>
        <tr>
            <th>H1</th>
            <th>H2</th>
            <th>H3</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>B1</th>
            <th>B2</th>
            <th>B3</th>
        </tr>
    </tbody>
</table>

<table class="general originalTable">
    <thead>
        <tr>
            <th>H1</th>
            <th>H2</th>
            <th>H3</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>B1</th>
            <th>B2</th>
            <th>B3</th>
        </tr>
    </tbody>
</table>
于 2012-11-12T19:28:48.647 に答える
0

すべてのテーブルに CSS プロパティを持たせたい場合は、次を使用します。

table {
    //some CSS code
}

すべての「一般的な」テーブルに何らかのプロパティを持たせたい場合は、次を使用します。

.general { 
    //some CSS code
}

特定の「特別な」テーブルに追加のプロパティを持たせたい場合は、次を使用します。

.special { 
    //some CSS code 
}

特定の 1 つのテーブルだけにプロパティを持たせたい場合は、次を使用します。

#newTable { 
    //some CSS code
}

2 つのテーブルにプロパティを持たせたい場合は、次を使用します。

#newTable, #oldTable {
    //some CSS code
}

最後の 1 つはさらに指定できることに注意してください。たとえば#newTable head, #oldTable head。

その後、あなたが持つことができます

<table id="newTable" class="general special">
    //some HTML code
</table>
于 2012-11-12T19:33:01.093 に答える