Стилизация с помощью CSS2, когда attr не установлен

StackOverflow https://stackoverflow.com/questions/1915325

  •  20-09-2019
  •  | 
  •  

Вопрос

Стилизовать элемент с набором атрибутов легко: E[attr].

Есть ли способ стилизовать элемент с помощью CSS2 на основе отсутствия атрибута, что-то вроде этого E[!attr]?(Решение JavaScript не является вариантом).

Например, есть несколько правил класса, за которыми следует правило id:

.abc {padding:1em;}
.def {padding:2em;}
#n a {padding:0;}

HTML-код:

<div id="n"><a href="" class="abc">.</a><a href="" class="def">.</a></div>

Классы abc и def имеют более низкий приоритет по сравнению с правилом id, поэтому оба a иметь отступ 0.Я не могу изменить последовательность правил, описанных выше, но могу изменить правило с идентификатором, добавив свои собственные правила.Я хочу избежать написания таких правил, как #n a.abc для каждого класса (их много).Вместо этого мне нужно что-то вроде #n a[!class] чтобы держать всех в курсе aон цел.

Это было полезно?

Решение

К сожалению, не в CSS2.Лучшее, что вы можете сделать, это каскадировать свои объявления:

E {color: red}
E[attr] {color: blue}

Но даже на это нельзя полагаться, поскольку IE6 не поддерживает селекторы атрибутов.

Однако в CSS3 есть прекрасный псевдоселектор «:not» (http://www.w3.org/TR/css3-selectors/#negation).

РЕДАКТИРОВАТЬ

Спасибо за разъяснение.Как насчет:

.abc {padding:1em; !important} .def{padding:2em; !important}

#n a{padding: 1em}

Другие советы

Я не думаю, что это можно сделать в CSS2.В CSS3 вы должны использовать синтаксис «не»:

input:not([type="file"])
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top