Menu
I was wondering what is the difference between quoted and unquoted attributes in css selectors and does that have any effect on performance.
input[type="text"]
/
input[type=text]
Thanks in advance
220
The CSS Attribute Selector is used to select an element with some specific attribute or attribute value. It is an excellent way to style the HTML elements by grouping them based on some specific attributes and the attribute selector will select those elements with similar attributes.
The Seven Different Types. Attribute selectors are case-sensitive by default (see case-insensitive matching below), and are written inside brackets [] . There are seven different types of matches you can find with an attribute selector, and the syntax is different for each.
The [attribute|="value"] selector is used to select elements with the specified attribute, whose value can be exactly the specified value, or the specified value followed by a hyphen (-). Note: The value has to be a whole word, either alone, like class="top", or followed by a hyphen( - ), like class="top-text".
The [attribute~=value] selector is used to select elements with an attribute value containing a specified word.
The above are the same. The quotes are optional for identifiers, but must be used when it is a string.
Some common examples of being a string include:
0-9)Here's the full spec of an identifier:
In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier "B&W?" may be written as "B\&W\?" or "B\26 W\3F".
Further reading: http://www.w3.org/TR/css3-selectors/#attribute-selectors
90
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
