Quick reference: CSS/CSS3 Attribute selectors

The basic syntax
selector[attribute]

Exact match – finds the exact match of the value
selector[attribute=value]

Partial match – finds a partial match of the whole word value. Doesn’t find valueExample or value-Example strings
selector[attribute~=value]

Hyphen(dash) match – finds a match of the value value seperated by dash. Doesn’t matter if it’s the first or last word in the string.
selector[attribute|=value]

Start of value match – finds the value match in the start of the string only. Includes valueExample and value-example strings
selector[attribute^=value]

End of value match – finds a match of the value in the end of the string only. Also includes valueExample and value-example strings
selector[attribute$=value]

Any part of value match – same as partial match but includes valueExample and value-example strings
selector[attribute*=value]

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s