title: CSS2 Attribute Selectors with Regex
body: <p><a href="http://www.w3.org/TR/REC-CSS2/selector.html#attribute-selectors" rel="noreferrer">CSS Attribute selectors</a> allow the selection of elements based on attribute values. Unfortunately, I've not used them in years (mainly because they're not supported by all modern browsers). However, I remember distinctly that I was able to use them to adorn all external links with an icon, by using a code similar to the following:</p>
  
  <pre><code>a[href=http] {
      background: url(external-uri);
      padding-left: 12px;
  }
  </code></pre>
  
  <p>The above code doesn't work. My question is: <strong>How does it work?</strong> How do I select all <code>&lt;a&gt;</code> tags whose <code>href</code> attribute starts with <code>"http"</code>? The official CSS spec (linked above) doesn't even mention that this is possible. But I do remember doing this.</p>
  
  <p>(<em>Note</em>: The obvious solution would be to use <code>class</code> attributes for distinction. I want to avoid this because I have little influence of the way the HTML code is built. All I can edit is the CSS code.)</p>