title: CSS: define font-weight by name
body: <p>I'm wondering if there would be a way to define an @font-face's weight with a string rather than just a number:</p>
  
  <pre><code>@font-face {
      font-family: 'My Font';
      src: url('../fonts/MyFont/light.eot');
      …
      font-weight: 'light', 300;
      font-style: normal;
  }
  @font-face {
      font-family: 'My Font';
      src: url('../fonts/MyFont/thin.eot');
      …
      font-weight: 'thin', 200;
      font-style: normal;
  }
  </code></pre>
  
  <p>I'm thinking it would be easier for someone breaking out a design into code if the weights matched (eg in Photoshop the font's weight will be <em>light</em>, not <em>300</em>).</p>
  
  <p>After reading the <a href="http://www.w3.org/TR/CSS2/fonts.html#font-boldness" rel="nofollow">W3 spec</a>, it sounds like they do intend you to match the names to a number, but that seems asinine, so I assume I'm missing something.</p>