css - li全体を変更せずに、順序付きリストの番号を定型化できますか？

Question

CSSを使用して、liコンテンツの周りに余分なマークアップを追加せず<ol>に、のテキスト全体を変更せずに、の番号のスタイルを変更することは可能ですか？<li>

Answer 1

<ol>元のスタイルを無効にして:beforeから、カウンター付きのセレクターを使用して、必要なスタイルを追加できます。ここのように：

ol {
    counter-reset: i 0;
}
ol li:before {
    content: counter(i);    
    counter-increment: i;
    padding-right: 0.5em;
    color: red;
}

必要に応じて、 n番目の子セレクター（JS Fiddle）を使用して、リストの特定の要素の一部のスタイルをオーバーライドすることもできます。

ol li:nth-child(3):before {
    color: violet;
}

...カスケードルールがまだここに適用されているため。ただし、これnth-childはIE8ではサポートされていないことに注意してください。