Как я могу создать чередующиеся цвета фона для строк списка, используя только ItemTemplate?

Как я могу создать чередующиеся цвета фона для строк списка, используя только ItemTemplate? Я не хочу использовать AlternateTemplate, потому что мне придется редактировать их оба каждый раз, когда я хочу что-то изменить, когда все, что я использую, — это создание чередующихся цветов фона. Итак, как я могу это сделать, используя только ItemTemplate? Спасибо!


person daveomcd    schedule 29.12.2011    source источник
comment
Вы можете вставить литеральный тег, в который вы визуализируете соответствующий CSS. К сожалению, я не любитель VB, но это должно направить вас на правильный путь.   -  person Tejs    schedule 29.12.2011
comment
Круто, спасибо, я посмотрю на это и отпишусь с моим решением, спасибо!   -  person daveomcd    schedule 29.12.2011


Ответы (4)


Если бы вы могли рассматривать чередующиеся цвета как прогрессивное усовершенствование и не обязательно во всех (старых) браузерах, вы могли бы использовать n-й дочерний селектор CSS, чтобы применить цвет без изменения HTML.

Если в вашем проекте уже есть jQuery (или аналогичный) и вам нужно решение для более старого браузера, вы можете использовать его для выбора каждой второй строки с помощью селектора :odd или :even.

Обновление (пример)

Предполагая, что мы используем строки таблицы

tr:nth-child(odd) td{  
  background-color: red;  
}

Вы также можете использовать even, 2n или 2n+1. Это будет одинаково хорошо работать с тегами <li>.

Дополнительные примеры: http://reference.sitepoint.com/css/pseudoclass-nthchild.

person Adam Pope    schedule 29.12.2011
comment
+1 Я проголосовал за ваш ответ, так как он лучший, но не могли бы вы опубликовать небольшой пример того, как это сделать с помощью CSS? Или хотя бы на пост, где можно посмотреть, как это делается? Просто для полноты... - person Icarus; 29.12.2011
comment
У меня это работает в Chrome, но не в IE9 :( Я даже отключил режим совместимости для сайтов интрасети. Есть идеи? - person daveomcd; 30.12.2011
comment
Это будет потому, что IE9 находится в режиме совместимости. Ознакомьтесь с этим вопросом для возможных причин переключиться в режим совместимости на моем сайте"> stackoverflow.com/questions/3726357/ - person Adam Pope; 30.12.2011

Это тоже может сработать:

Чередование цветов строк таблицы с помощью элемента управления ASP.Net ListView

Он использует синтаксис стиля ‹%# на странице ASPX для переключения класса на основе DisplayIndex Mod 2.

Примеры кода С# и VB также по этой ссылке...

person Eric Burdo    schedule 29.12.2011

Используйте событие ItemDataBound ListView (если оно есть, как у Repeater). Добавьте элемент runat="server" в свой ItemTemplate, который можно использовать для установки цвета с помощью класса. Получите ссылку на этот элемент управления в событии и установите класс css.

person Keith Walton    schedule 29.12.2011

Вы пытались использовать элемент управления Repeater вместо ListView.

У вас будет больше контроля над шаблоном, и вам будет проще менять чередующиеся цвета без дублирования шаблонов.

person Eric Burdo    schedule 29.12.2011