2

クラス セレクターを使用したテーブルのスタイリングに問題があります。

thclass="pause" を持つ要素の色tdと、同じクラス名の要素の色の 2 つの異なる色が必要です。

この CSS が機能しない理由:

.timetable th .pause {
    background-color:#F99;
}
.timetable td .pause {
    background-color:#FEE;  
}

このHTMLで？

<table class="timetable">
<thead>
    <tr>
        <th>Tispunkt</th>
                <th style='height:30px;'>08:00</th>
        <th style='height:30px;'>08:30</th>
        <th style='height:30px;'>09:00</th>
        <th style='height:15px;'>09:30</th>
        <th style='height:15px;' class='pause'>09:45</th>
        <th style='height:30px;'>10:00</th>
        <th style='height:30px;'>10:30</th>
        <th style='height:30px;'>11:00</th>
        <th style='height:30px;'>11:30</th>
        <th style='height:30px;'>12:00</th>
        <th style='height:30px;' class='pause'>12:30</th>
        <th style='height:30px;'>13:00</th>
        <th style='height:30px;'>13:30</th>
        <th style='height:30px;'>14:00</th>
        <th style='height:30px;'>14:30</th>
        <th style='height:30px;'>15:00</th>
        <th style='height:30px;'>15:30</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>Maskine 4</td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
        <td style='height:15px;'></td>
        <td style='height:15px;' class='pause'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;' class='pause'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
        <td style='height:30px;'></td>
    </tr>
</tbody>

このCSSは機能します

.timetable .pause {
    background-color:#F99;  
}

thしかし、要素とtd要素の色を変えたい

4

1 に答える 1

2

次のものが必要です。

.timetable th.pause {
    background-color:#F99;
}
.timetable td.pause {
    background-color:#FEE;  
}

タグとクラス名の間にスペースはありません。

于 2013-09-27T18:42:31.630 に答える