Способ сделать это - использовать правила nth-child (четное) и (нечетное). К сожалению, и это не должно вызывать удивления, IE6 не поддерживает это. Итак, у вас есть несколько вариантов:
A) Используйте Javascript, с очевидным недостатком: он не работает для людей с отключенным JS:
var rows = document.getElementById('mytable').getElementsByTagName('tr');
for(var x = 0; x < rows.length; x++) {
rows[x].className = (x % 2 == 0) ? 'even' : 'odd';
}
Если вы ожидаете, что в вашем приложении потребуется более динамичное поведение на стороне клиента, вы можете проверить такую библиотеку, как jQuery. Для только для этого это не нужно, но это облегчает работу с Javascript в разных браузерах. Вы бы сделали выше с jQuery, как показано в этом ответе.
В зависимости от вашей аудитории, Javascript может быть вполне приемлемым. Если это не так, то, возможно, вы можете ...
B) Упростите свой CSS и продолжайте делать это вручную. Вы можете пометить нечетные строки только классом, а затем сделать стиль по умолчанию для строки четным. Это сэкономит вам некоторую работу при перемещении вещей.
C) Генерировать строки программно. На самом деле архаично вводить подобные данные в фиксированную таблицу, если вы собираетесь обновлять ее достаточно часто, чтобы это стало проблемой. Я, очевидно, не обращаю внимания на ваши обстоятельства, но было бы тривиально сделать это каким-то образом в цикле с простым языком, таким как PHP.
D) Прекратить использование действительно устаревшего браузера. :) (Это только наполовину шутка, так как я уверен, что это вне вашего контроля)