Селектор CSS для всех столбцов таблицы больше nth-of-type (2)?

Мой текущий CSS выбирает второй столбец:

tr td:nth-of-type(2) {
  padding-left:20px;
  width:100px;
  background-color:yellow;
}

Как настроить таргетинг на все столбцы после второго?

Ответы

Ответ 1

Вы можете использовать:

tr td:nth-of-type(2) ~ td

~ (общий селектор) выберет все <td> элементы sibling после второй.

Обратите внимание, что nth-of-type не поддерживается в более старых версиях IE (8 и раньше).

В качестве альтернативы вы можете использовать td:nth-child(n+3) - снова это не поддерживается в IE8 и ранее, но если вы хотите использовать nth-child (не только для этого одного случая) и, вероятно, используете библиотеку JavaScript как jQuery, всегда есть Selectivizr, который заставит его (и различные другие селекторы) работать в IE6 до IE8.

Ответ 2

это будет работать...

tr td:nth-of-type(n+3)
{
    padding-left:20px;
    width:100px;
    background-color:yellow;
}

аналогичная ссылка вопроса

Ответ 3

td + td + td {

}

Соответствует трем столбцам и всем столбцам позже. Это CSS2 и не требует свойства "nth-of-type", которое не поддерживается в старых браузерах, таких как браузер (IE7), который я использую сейчас!

Ответ 4

Просто определите colgroup и примените стиль к этому.