Существует ли CSS не, равняется селектору?
Есть ли что-то как! = (не равный) в CSS? например, у меня есть следующий код:
input {
...
...
}
но для некоторых исходных данных я должен освободить это. Я хотел бы сделать это путем добавления класса "сброс" к входному тегу, например.
<input class="reset" ... />
и затем просто пропустите этот тег из CSS.
Как я могу сделать это?
Единственным путем я вижу, должен был бы добавить некоторый класс к входному тегу и переписать CSS следующим образом:
input.mod {
...
...
}
4 ответа
В CSS3 вы можете использовать фильтр : not () , , но еще не все браузеры полностью поддерживают CSS3, поэтому убедитесь, что вы знаете, что вы делает , который сейчас
поддерживается всеми основными браузерами (и уже довольно давно; это старый ответ ...).
Пример:
<input type="text" value="will be matched" />
<input type="text" value="will not be matched" class="avoidme" />
<input type="text" value="will be matched" />
и CSS
input:not(.avoidme) { background-color: green; }
Примечание: этот обходной путь больше не нужен; Я оставляю это здесь для контекста.
Если вы не хотите использовать CSS3, вы можете установить стиль для всех элементов, а затем сбросить его с помощью класса.
input { background-color: green; }
input.avoidme { background-color: white; }
вместо class = "reset" вы можете изменить логику, указав class = "valid" Вы можете добавить это по умолчанию и удалить класс, чтобы сбросить стиль.
Итак, из вашего примера и Томаса
input.valid {
...
...
}
и
<input type="text" value="will be matched" class="valid"/>
<input type="text" value="will not be matched" />
<input type="text" value="will be matched" class="valid"/>
Вы также можете сделать это, «отменив» изменения в классе сброса только в CSS.
INPUT {
padding: 0px;
}
INPUT.reset {
padding: 4px;
}
CSS3 имеет : not () , но он пока реализован не во всех браузерах. Однако он реализован в предварительной версии платформы IE9.
input:not(.reset) { }
http://www.w3.org/TR/css3-selectors/#negation
А пока вам придется придерживаться устаревших методов.