Использование CSS, как изменить только второй столбец таблицы

Используя только css, как я могу переопределить css только второго столбца таблицы.

Я могу получить все столбцы, используя:

.countTable table table td

Я не могу перейти на html на этой странице, чтобы изменить его, поскольку это не мой сайт.

Спасибо.

Ответы

Ответ 1

Вы можете использовать псевдо-класс :nth-child следующим образом:

.countTable table table td:nth-child(2)

Обратите внимание, что это не будет работать в старых браузерах (или IE), вам нужно будет дать ячейкам класс или использовать javascript в этом случае.

Ответ 2

Попробуйте следующее:

.countTable table tr td:first-child + td

Вы также можете подтвердить, чтобы стиль остальных столбцов:

.countTable table tr td:first-child + td + td {...} /* third column */
.countTable table tr td:first-child + td + td + td {...} /* fourth column */
.countTable table tr td:first-child + td + td + td +td {...} /* fifth column */

Ответ 3

Чтобы изменить только второй столбец таблицы, используйте следующее:

Общий случай:

table td + td{  /* this will go to the 2nd column of a table directly */

background:red

}

Ваш случай:

.countTable table table td + td{ 

background: red

}

Примечание: это работает для всех браузеров (современных и старых), поэтому я добавил свой ответ на старый вопрос

Ответ 4

Вы можете назначить класс для каждой ячейки во втором столбце.

<table>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
<tr><td>Column 1</td><td class="col2">Col 2</td></tr>
</table>

Ответ 5

на этом веб-сайте http://quirksmode.org/css/css2/columns.html Я нашел этот простой способ

<table>
<col style="background-color: #6374AB; color: #ffffff" />
<col span="2" style="background-color: #07B133; color: #ffffff;" />
<tr>..