Как изменить цвет ряд в bootstrap 3?

Question

Я хочу изменить цвет фона чередующихся строк в загрузочной 3 сетке.Я думал, что могу создать некоторые CSS и добавить его в класс в Div, но цвет не меняется.

Вот мои CSS:

.row-buffer {
margin-top:20px;
margin-bottom:20px;
}

.row-even {
background-color:#76A0D3;
}
.row-odd {
background-color:#BDE3FB;
}

.

и моя строка определяется так:

<div class="row row-buffer row-even">

.

или:

<div class="row row-buffer row-odd">

.

Буфер строки работает отлично работает, но ряд - даже рядные нечетные, похоже, не имеют никакой разницы?(Мои строки определяются в контейнере.)

Я лаю неправильному дереву?

Answer 1

Без возможности видеть вашу точную ситуацию, я собираюсь догадаться, что у вас возникла проблема из-за специфики селектора.Если Bootstrap имеет более конкретный селектор, чем просто .Class, то ваше правило никогда не переопределит его.Вам либо нужно соответствовать или быть более конкретно в вашем селекторе, чем загрузка.

Простой способ обычно получить много специфичности - добавить идентификатор на ваши селекторы, такие как:

#myrows .row-even {
    background-color:#76A0D3;
}
#myrows .row-odd {
    background-color:#BDE3FB;
}

.

Я создал небольшой пример того, как специфичность может вызвать проблемы: http://jsfiddle.net/path411/jyuy2/

Answer 2

Это конкретные селекторы, которые вы можете переопределить, чтобы изменить цвет нечетных строк в Bootstrap:

.table-striped>tbody>tr:nth-child(odd)>td, 
.table-striped>tbody>tr:nth-child(odd)>th {
    background-color: #your-color;
}

.

Answer 3

Я предполагаю, что вы пытаетесь создать разные фоновые стили / цвета для чередующихся строк в таблице.

Самый простой способ - просто добавить самостоятельный тег

    <AlternatingRowStyle CssClass="danger" />

.

Внутри вашей таблицы перед данными. Управление GridView в ASP.NET просто поместите это после ASP

Тег GridView и перед тегом столбцов.

Вы немедленно увидите эффект, поскольку Bootstrap имеет это предопределенное.

Я надеюсь, что мой ответ поможет кому-то в будущем.

ура!