Главная » Полезные статьи » HTML-верстка » Yii: Красим нечётные и чётные строки в CListView разными цветами с помощью css
Распечатать статью

Yii: Красим нечётные и чётные строки в CListView разными цветами с помощью css

Как залить строку через строку в таблице разными цветами для удобства взгляду.Стиль зебры для строк в CListView.

В Yii это делается очень легко с помощью стилей css. Добавляем 2 стиля для классов в main.php:

.even {background:#fff9e0;}
.odd {background:#ffffff;}


Дальше в виде для itemView (у нас это _view_list.php) обращаемся к переменной $index, доступной в itemView в классе CListView, которую проверяем на чётность и устанавливаем соответствующий стиль классу.

<tr class="<?= ($index % 2) ? 'even' : 'odd' ?>">
	<td width="20px"><?php echo $index+1; ?></td>
	<!--<td><?//php echo CHtml::encode($data->id); ?></td>-->
	<td><?php echo CHtml::encode($data->name); ?></td>
	<td><?php echo CHtml::encode($data->surname); ?></td>
	<td><?php echo CHtml::encode($data->city_id); ?></td>
</tr>

или так:

<!-- inside your CListView's itemView partial -->
<divmargin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; border-image: initial; vertical-align: baseline; background-image: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: transparent; color: rgb(0, 153, 0); background-position: initial initial; background-repeat: initial initial; ">($index % 2) ? 'odd' : 'even' ?>">
...

Источник:  loco.ru
Вы можете оставить комментарий, или обратную ссылку на Ваш сайт.

Оставить комментарий

Похожие статьи