Wednesday, March 11, 2015

css complex attribute selector

/* Attribute Present Selector */
#checkoutSteps a[target] {
  color: #fff;
}

/* Attribute Equals Selector */
#checkoutSteps label[for="billing:firstname"] {
  color: #fff;
}


/* Attribute Begins With Selector */
#checkoutSteps label[for^="billing:"] {
  color: #fff;
}

/* Attribute Contains Selector */
#checkoutSteps label[for*="billing:"] {
  color: #fff;
}


/* Attribute Ends With Selector */
#checkoutSteps a[href$=".pdf"] {
  color: #fff;
}

/* Attribute Spaced Selector - attribute is within space separated list */

a[rel~="tag"] {...}

<a href="#" rel="tag nofollow">...</a>

/* Attribute Hyphenated Selector - attribute is within dash separated list */

a[lang|="en"] {...}

<a href="#" lang="en-US">...</a>

Reference:

http://learn.shayhowe.com/advanced-html-css/complex-selectors/

No comments: