What is this CSS selector? [class*=”span”]

by

It’s an attribute wildcard selector. In the sample you’ve given, it looks for any child element under .show-grid that has a class that CONTAINS span.

So would select the <strong> element in this example:

<div class="show-grid">
    <strong class="span6">Blah blah</strong>
</div>

You can also do searches for ‘begins with…’

div[class^="something"] { }

which would work on something like this:-

<div class="something-else-class"></div>

and ‘ends with…’

div[class$="something"] { }

which would work on

<div class="you-are-something"></div>

Good references

More Related Contents:

  1. Is there a CSS parent selector?
  2. Which characters are valid in CSS class names/selectors?
  3. How are the points in CSS specificity calculated
  4. Select every Nth element in CSS
  5. CSS Selector that applies to elements with two classes
  6. CSS selector for “foo that contains bar”? [duplicate]
  7. How to use JSF generated HTML element ID with colon “:” in CSS selectors?
  8. What does an asterisk (*) do in a CSS selector?
  9. CSS selector based on element text? [duplicate]
  10. Pure CSS checkbox image replacement
  11. Handling a colon in an element ID in a CSS selector [duplicate]
  12. How can I select an nth child without knowing the parent element?
  13. IE8 :nth-child and :before
  14. CSS selector to select first element of a given class
  15. Can I use variables for selectors?
  16. How to select label for=”XYZ” in CSS?
  17. CSS: styled a checkbox to look like a button, is there a hover?
  18. In which direction do selector engines read, exactly?
  19. CSS Selector for
  20. How can I apply styles to multiple classes at once?
  21. Is it possible to select the last n items with nth-child?
  22. CSS property value from class name
  23. LESS CSS: abusing the & Operator when nesting?
  24. Angular 2: How to style host element of the component?
  25. How do I select an element only when inside another element?
  26. Should I use single colons (:) or double colons (::) for before, after, first-letter and first-line pseudo-elements?
  27. How do I apply a style to all children of an element
  28. CSS class repetition to increase specificity
  29. select second child
  30. How does CSS specificity decide which styles to apply?

Leave a Comment