What does [class*="span"] do for CSS?

Question

I was looking at the Twitter Bootstrap 2 CSS file and saw [class*="span"]. What does it do, and what is the name of that method?

Answer 1

That's the CSS attribute selector. It selects elements containing span in their class attribute.

For e.g.

<div class="myclass span-12"></div>

You could select the above element by

[class*="span"]

Answer 2

It means that any element that has a class and the word span is present in the class name, i.e.

<div class='span-1'></div>
<div class='my-span'></div>

[class*="span"] will select all above and more tthat contains the word span. Read more.

Answer 3

CSS Attribute Selector

That is a CSS attribute selector, which follows the syntax [attribute*="value"] where "attribute" is an HTML element attribute (i.e. class) and "value" is contained somewhere within the attribute string.

Your example is a CSS selector that will match any HTML element where the string "span" is contained within the element's class name string.

For more information on CSS attribute selectors, see the following article from CSS-Tricks: http://css-tricks.com/attribute-selectors/