Skip to content
Please note that GitHub no longer supports Internet Explorer.

We recommend upgrading to the latest Microsoft Edge, Google Chrome, or Firefox.

Learn more

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Seven different types of CSS attribute selectors
// This attribute exists on the element
[value]
// This attribute has a specific value of cool
[value='cool']
// This attribute value contains the word cool somewhere in it
[value*='cool']
// This attribute value contains the word cool in a space-separated list
[value~='cool']
// This attribute value starts with the word cool
[value^='cool']
// This attribute value starts with cool in a dash-separated list
[value|='cool']
// This attribute value ends with the word cool
[value$='cool']
@emkis

This comment has been minimized.

Copy link

emkis commented Jan 31, 2020

freaking amazing! 😮

@kjvdven

This comment has been minimized.

Copy link

kjvdven commented Feb 3, 2020

@miguel-ra

This comment has been minimized.

Copy link

miguel-ra commented Feb 3, 2020

Also you can check the attribute hasn't a specific value, with the negation pseudo-class selector

:not([value='cool'])

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.