Есть ли CSS-селектор для элементов без атрибута?
Я понимаю, что правила css могут настраивать элементы, указанные значениями атрибутов, например:
input[type="text"] {}
Могу ли я создать правило, которое предназначено для элементов, которые пропускают определенный атрибут? Например, можно ли настроить таргетинг на элементы, которым не хватает href или элементов, которые не указывают тип?
Ответы
Ответ 1
Вы можете следовать этому шаблону:
a:not([href])
input:not([type])
Селектор атрибутов используется для выбора элементов с указанным атрибутом.
:not
поддерживается во всех современных браузерах и IE9 +, если вам нужна поддержка IE8 или ниже, вам не повезло.
Ответ 2
Для ссылок вы можете просто использовать:
a { color: red; }
a:link { color: green; }
скрипт: http://jsfiddle.net/ZHTXS/ нет необходимости в javascript.
Для атрибутов формы используйте шаблон атрибута not, указанный выше input:not([type])
, и если вам нужно поддерживать более старые версии IE, я бы, вероятно, добавил класс и использовал таблицу стилей, специфичную для IE, связанную с условными комментариями.
Ответ 3
Вы всегда можете установить другой стиль в и href
Проверьте это:
http://jsfiddle.net/uy2sj/
Ответ 4
Единственное решение, которое сработало для меня, заключалось в размещении a:link { }
в моем коде.
Я тоже пробовал
a:not([href]) input:not([href=""]) input:not([href~=""])
Но для файла .scss с несколькими тегами a, используемыми в качестве стандартных блоков кода (не моя идея), это было единственное решение.
Ответ 5
Простой ответ для этого.
Нет.
Вы можете сделать это через JavaScript, если хотите, чтобы я предоставил это решение?
Однако CSS Hack
(Тем не менее, есть "хакерский" способ, о котором я только что подумал о CSS).
Возьмите этот сценарий... вам нужны теги <a>
, у которых нет href, чтобы он был окрашен в красный цвет.
Например, вы можете предположить, что единственными атрибутами, которые вы будете удерживать, будет:
- альт
- название
- HREF
- цель
и т.д.
Что вы могли делать, создает глобальное правило для тега привязки.
Например,
a {
color: red;
}
Затем вы просто создаете правило, которое будет переопределять это глобальное правило после этого объявления для каждого из атрибутов, которые вы ожидаете от него.
Итак, у вас будет
a[href] {
color: blue;
}
Теперь вы узнаете, что любой тег, который отсутствует в href, будет красным.
Оригинальный вопрос, заданный
Можно ли создать правило, которое предназначено для элементов, которые опускают определенный атрибут?
И ты не можешь! Нет перекрестного браузера, способ targeting/выбора элементов, которые пропускают атрибут с помощью CSS. Поэтому я чувствую, что решение, которое я предлагаю, является взломом, потому что оно идет против зерна, чтобы достичь того, что задал вопрос.