[CSS] olの数字だけを太字にする方法

サンプルとコード

  1. first item
  2. second item
    1. second item first subitem
    2. second item second subitem
    3. second item third subitem
  3. third item
ol {
  counter-reset: li; 
  list-style: none; 
}

ol > li:before {
  content:counter(li) ". ";
  counter-increment: li;
}

従来の数字はlist-style:noneで消す。
counter-incrementで数字を付けてやる(その追加した数字を装飾する)。

あまりcounter-incrementは使いたくなかったけど、構造を崩さずにCSSだけで指定するのは現状この方法しかないみたい。
<span>を使うなら以下の方法

<ol style="font-weight:bold">
  <li><span style="font-weight:normal">hoge</span></li>
</ol>
twitterfacebookhatenafacebook