CSS attribute selectors

[rel=value] — attribute equals to value

<h1 rel="value">Attribute Equals</h1>

h1[rel=value] { color: red; }

[rel*=value] — attribute contains value anywhere

<h1 rel="xxxvaluexxx">Attribute Contains</h1>

h1[rel*=value] { color: red; }

[rel^=value] — attribute starts with value

<h1 rel="value-link yep">Attribute Begins</h1>

h1[rel^=value] { color: red; }

[rel$=value] — attribute ends with value

<h1 rel="friend value">Attribute Ends</h1>

h1[rel$=value] { color: red; }

[rel~=value] — attribute contains value in space-delimited list

<h1 rel="friend value sandwich">Attribute Space Separated</h1>

h1[rel~=value] { color: red; }

[rel|=value] — attribute contains value in dash-delimited list

<h1 rel="friend-value-sandwich">Attribute Dash Separated</h1>

h1[rel|=value] { color: red; }