title: CSS regex selector match one OR another condition?
body: <p>I'd like to match when <code>/(\sclassName|^className)/</code> is satisfied, but when selecting css. Hypothetically I would use like:</p>
  
  <pre class="lang-css prettyprint-override"><code>[class(^|\s)='className'] {
    font-size: 5000px;
  }
  </code></pre>
  
  <p>I've found this resource, which is very nice: <a href="http://css-tricks.com/attribute-selectors/" rel="noreferrer">The Skinny on CSS Attribute Selectors</a>, but it doesn't mention this use case.</p>
  
  <p>I just want to match "icon-" in the following 2 examples, but not the 3rd. </p>
  
  <p>Here, this can be achieved with <code>[class^='icon-]</code></p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class='icon-something another-class'&gt;
  </code></pre>
  
  <p>Here, this can be achieved with <code>[class~='icon-']</code>, but this does not match when 'icon-' is at the very beginning of the class string:</p>
  
  <pre><code>&lt;div class='another-class icon-something'&gt;
  </code></pre>
  
  <p>I do not want to match this, with -icon in the middle of a string. I believe <code>*=</code> will match this one, as will <code>|=</code> :</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class='another-icon-class another-class'&gt;
  </code></pre>