У меня есть динамическая таблица, в этой ссылке jsfiddle приведен пример ее части.
Я хотел бы добавить соответствующий CSS для чередования столбцов цвета по дате, я ищу CSS, например:
tr:nth-child(4n) td { }
Но я не знаю, на что мне изменить 4-ю итерацию, которая окрашивает все ячейки столбца под даты.
Какой подход может быть лучшим?
Ваш код повлияет на все ячейки в каждой четвертой строке.
Вы хотите, чтобы строка заголовка чередовала цвет каждого другого столбца, а строки данных чередовали 4-й, 5-й и 6-й из каждых 6 столбцов.
thead tr th:nth-child(2n) {
background-color: #ccf;
}
tbody tr th:nth-child(6n + 4),
tbody tr th:nth-child(6n + 5),
tbody tr th:nth-child(6n + 6),
tbody tr td:nth-child(6n + 4),
tbody tr td:nth-child(6n + 5),
tbody tr td:nth-child(6n + 6) {
background-color: #ccf;
}
Если вы хотите покрасить столбцы, вам нужно переместить часть селектора :nth-child(n) в td, а также удалить букву «n»:
tr td:nth-child(1)
Быстрое редактирование вашей скрипки, это то, что вы имеете в виду?:
