Селекторы атрибутов CSS: правила кавычек ( "," или none?)
Этот вопрос уже давно подслушивал меня. При написании селектора CSS, который сравнивается с атрибутом элемента, таким как.
a[rel="nofollow"]
Я никогда не знаю, что я должен делать с кавычками. Действительно ли они необходимы?
В принципе, что такое спецификация для этого, потому что я не могу найти его на веб-сайте.
Все ли они считаются действительными?
a[rel="nofollow"]
a[rel='nofollow']
a[rel=nofollow]
Ответы
Ответ 1
Здесь я более подробно излагал эту тему: Некотируемые значения атрибутов в HTML и CSS.
Ive также создал инструмент, который поможет вам ответить на ваш вопрос: http://mothereff.in/unquoted-attributes
![Unquoted attribute value validator]()
Обычно вы можете опускать кавычки, если значение атрибута является буквенно-цифровым (однако есть некоторые исключения - см. связанную статью для всех деталей). Во всяком случае, я считаю хорошей практикой добавлять кавычки в любом случае в случае необходимости, т.е. a[href^=http://] не работает, но a[href^="http://"] будет.
В статье я упомянул ссылки на соответствующие главы в спецификации CSS.
Ответ 2
Значения атрибутов должны быть идентификаторами или строками
- http://www.w3.org/TR/CSS2/selector.html#attribute-selectors
Первые два используют строки. Третий использует идентификатор.
Идентификаторы (включая имена элементов, классы и идентификаторы в селекторах) могут содержать только символы [a-zA-Z0-9] и символы ISO 10646 U + 00A0 и выше, плюс дефис (-) и подчеркивание ( _); они не могут начинаться с цифры, двух дефисов или дефиса, за которым следует цифра.
- http://www.w3.org/TR/CSS2/syndata.html#value-def-identifier
Строки могут быть записаны с двойными кавычками или с одинарными кавычками.
- http://www.w3.org/TR/CSS2/syndata.html#strings
