Селектор атрибутов CSS: Применить класс, если пользовательский атрибут имеет значение? Кроме того, это будет работать в IE7 +? - PullRequest
6 голосов
/ 20 июня 2011

Я хотел бы использовать селектор атрибутов CSS, чтобы применить класс к некоторым диапазонам, но только если у них есть контент. У меня есть пользовательский атрибут, который будет иметь значение только в том случае, если диапазон содержит содержимое: «entityvalue». При использовании CSS ниже он не применяет класс ни к каким элементам, даже если entityvalue='1634' находится в HTML.

.ApplicationName[entityvalue="*"]  {
                 display: inline;
                 background-image: url("../images/icon_application.PNG");
                 background-repeat: no-repeat;
                 background-position: left;
                 padding-left: 12px;
                 }

Я попробовал .ApplicationName[entityvalue!=""], как было найдено на некоторых сайтах, но, видимо, это не в стандартах CSS (не работает в Chrome), что действительно плохо, потому что .ApplicationName[entityvalue=""] делает в точности то, что мне нужно ...

Вот примеры содержимого span / div WITH (которое должно быть стилизовано) и содержимого span / div БЕЗ содержимого (которое НЕ должно стилизоваться):

<div class="ApplicationName Redirect" entitytype="Application" entityvalue=""></div>

<div class="ApplicationName Redirect" entitytype="Application" entityvalue="1234">Microsoft Outlook</div>

1 Ответ

13 голосов
/ 20 июня 2011

Опустить часть значения:

.ApplicationName[entityvalue]

Это работает с IE7 +.

Если вы параноидально настроены на entityvalue, установленный в пустоту, и не хотите включатьэти элементы:

.ApplicationName[entityvalue]:not([entityvalue=""])

Это не работает с IE7 +.

Если вам нужно удовлетворить это, у вас есть несколько вариантов:

  • Определите стиль переопределения / сброса для .ApplicationName[entityvalue=""], поэтому у вас есть одно правило с первым селектором выше и другое правило с этим.

  • Используйте JavaScript для поиска элементовс пустым атрибутом и добавьте класс, который вы можете стилизовать.

  • Если вы можете изменить код на стороне сервера, чтобы выводить этот атрибут по-другому, это еще более простой путь.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...