Отмена каскадного поведения CSS - PullRequest
Новая
       4

Отмена каскадного поведения CSS

0 голосов
/ 09 мая 2011

CSS-разметка: 

<td class="ui-datepicker-current-day">
    <a href="#" class="ui-state-default ui-state-active">17</a>
</td>

Правила CSS : 

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default
{
    background: url("images/ui-bg_glass_75_e6e6e6_1x400.png") repeat-x scroll 50% 50% #E6E6E6;
    border: 1px solid #D3D3D3;
    color: #555555;
    font-weight: normal;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active
{
    background: url("images/ui-bg_glass_65_ffffff_1x400.png") repeat-x scroll 50% 50% #FFFFFF;
    border: 1px solid #AAAAAA;
    color: #212121;
    font-weight: normal;
}

Когда добавляется активный класс, он переопределяет стили по умолчанию, которые являются нормальными.Но я не хочу такого поведения.Я хочу восстановить стили, добавленные (переопределенные) классом ui-state-active обратно к значениям, указанным в ui-state-default, с минимальными усилиями: без изменения исходного CSS и / или удаления класса. Что-то вроде: 

.ui-state-active {
background: inherit;
}

, похоже, сработало, но я не уверен, правильно ли это.

Редактировать

Я могудобавить классы на родителя, как это: 

<td class="ui-datepicker-current-day DISABLE-STATE-ACTIVE-CLASS">
    <a href="#" class="ui-state-default ui-state-active">17</a>
</td>

Ответы [ 2 ]

1 голос
/ 09 мая 2011

не уверен, почему это «кажется, работает», это явно не должно. если в цепочке наследования нет другого элемента, для которого задано «background», значение следует переустановить на «transparent» (значение по умолчанию).

вы не можете сделать объявление «отмененным» таким образом, хотя для этого могут быть веские причины (как в вашем случае). Я предполагаю, что единственный способ вернуться к значению фона, определенному в 'ui-state-default', это удалить класс 'ui-state-active' из элемента dom. это потребует внесения изменений в код js плагинов, и понятно, почему вы хотели этого избежать.

почему бы просто не установить тот же цвет в CSS? всего несколько кликов в themeroller:)

0 голосов
/ 09 мая 2011

Что вы хотели, чтобы фон отображался?

Наследование будет работать, если вы всегда хотите, чтобы этот td наследовал свой фон от своего родителя.При этом, как правило, это то, как вы обрабатываете переопределения в CSS.Либо переопределите настройку стиля встроенным, с переопределенным стилем в теге <style> с равным или более высоким приоритетом, либо переопределенным стилем с тегом !important.

В вашем примере это выглядит какbackground: inherit должно быть хорошо, но если это не сработает, вы всегда можете попробовать старый режим ожидания background: transparent.

...