Задача
Из обьемной готовой таблицы вида:
сделать таблицу вида:
Перегребать и ставить классы на ячейки и строки - неэффективно
Пишем нужные стили:
/* program table */
table.program, .program td, .program th {
border: none;
color: #969696;
padding: 10px 5px;
text-align: center;
}
.program th {
background: #1c1b13;
padding: 10px !important;
}
.hilight th {
background: #282820;
}
.program td {
background: #141414;
}
td.light {
background: #0a0a0a
}
.hilight td {
background: #212121;
}
.hilight td.light {
background: #171717;
}
.th2 th {
background: #464646;
}
.th2 th.light {
background: #3e3e3e;
}
.th2 th.first {
background: #4c4b45;
color: #fff !important;
}
/* program table */
и маленький скриптик под JQuery:
$(function () {
if($('table.program').length) {
$('table.program').find('tr:even').addClass('hilight');
$('table.program tr.th2').find('th:even').addClass('light');
$('table.program tr.th2').find('th:first').addClass('first');
$('table.program').find('td:odd').addClass('light');
}
});
И таблица раскрашивается, стоит лишь на нее навесить класс
:)