2016-10-20 3 views
-2

В моем CSS У меня есть правило:Переопределение правила CSS в primefaces

.ui-state-hover, 
.ui-widget-content .ui-state-hover, 
.ui-widget-header .ui-state-hover, .ui-state-focus, 
.ui-widget-content .ui-state-focus, 
.ui-widget-header .ui-state-focus { 
     font-weight: none; 
     background-image: none !important; 
     text-shadow: none !important; 
     box-shadow: none !important; 
     border-radius: 0 !important; 
     color: black; 
     background-color:#d2d6de !important; 
    } 

Таким образом, в PrimeFaces все компоненты, которые получают парил будут принимать это правило, но я не хочу, компоненты, имеет класс .ui-inputfield взять background-color:#d2d6de !important;, так это то, что я попытался (После первого правила):

.ui-inputfield .ui-state-hover, 
.ui-widget-content .ui-inputfield .ui-state-hover, 
.ui-widget-header .ui-inputfield .ui-state-hover{ 
    background-color: none !important; 
} 

, но он не работает, и цвет фона всегда #d2d6de всякий раз, когда я зависать или фокус этих компонентов, пожалуйста, обратите внимание, что все компонента в PrimeFaces всегда будет t ake .ui-state-hover, когда мы его наводим.

Как я могу это решить?

+2

Создайте более конкретное правило CSS, чтобы переопределить правило PrimeFaces. Например, добавляя 'html', поэтому' html .ui-state-hover {background-color: red} '. См. Также https://developer.mozilla.org/en/docs/Web/CSS/Specificity –

+0

Я не понимаю, почему я получаю downvotes вместо получения помощи? –

+1

Потому что ему не хватает основного исследования (несколько очень связанных, почти одинаковых вопросов). – Kukeltje

ответ

0

Ваш подход к созданию более конкретного правила является правильным, но ваш селектор ошибочен. Классы ui-inputfield и ui-state-hover находятся на одном элементе. Как вы его написали, ui-state-hover находится на дочернем элементе элемента с классом ui-inputfield. Это не относится к полям ввода; оба класса находятся на одном и том же элементе, поэтому ваш селектор должен быть:

.ui-inputfield.ui-state-hover { ... } 

Итак, без пробела.

Смежные вопросы