CSS wildcard or CSS Regular expression? – You may be looking for CSS Attribute Selector.

CSS Attribute Selector - Here’s the scenario: You want to add styling to all elements that have “read” in the  name of the class.

For instance: Below classes have some of the same wording.

mark-as-unread
mark-as-reading
mark-as-read
mark-as-not-interested

 

In CSS, selectors are patterns used to select the element(s) you want to style.  If you are looking for a CSS wildcard or CSS Regular expression then what you might  be trying to find is a CSS Attribute Selector.

CSS Attribute Selector – HTML – for CSS Wildcard

*note the space after “-read ” for book 3.

 

CSS Attribute Selector – CSS – for CSS Wildcard

 

Book 1
Book 2
Book 3
Book 4

 

http://jsfiddle.net/nickfever/Akxgn/9/

http://stackoverflow.com/questions/5110249/wildcard-in-css-for-classes

http://jsfiddle.net/K3693/1/

 

CSS Wildcard or CSS Selectors to note

  • ^ – matches if the attribute begins with the given string
  • $ – matches if the attribute ends with the given string
  • * – matches any part of the attribute value that contains given string

 

CSS Selectors List / CSS Wildcard Table

Selector Example Example description CSS
[attribute] [target] Selects all elements with a target attribute 2
[attribute=value] [target=_blank] Selects all elements with target=”_blank” 2
[attribute~=value] [title~=nickfever] Selects all elements with a title attribute containing the word “nickfever” 2
[attribute|=value] [lang|=en] Selects all elements with a lang attribute value starting with “en” 2
[attribute^=value] a[src^="https"] Selects every <a> element whose src attribute value begins with “https” 3
[attribute$=value] a[src$=".pdf"] Selects every <a> element whose src attribute value ends with “.pdf” 3
[attribute*=value] a[src*="nickfever"] Selects every <a> element whose src attribute value contains the substring “nickfever” 3

 

More CSS Selectors

http://www.w3schools.com/cssref/css_selectors.asp

 

If you are looking for a CSS wildcard or CSS Regular expression - You may be looking for CSS Attribute Selector.

 

Search Terms:
CSS wildcard, CSS regular expression, CSS attribute selector

Leave a reply

required

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">