カスタムオーダーリストの内容

Question

私は立法府の法律で見ている順序付きリストの書式を模倣したいと考えています。あなたが指定した順序付きリストにタグ<ol>を使用する必要があり、すべての項目が<li>「リスト項目」でなければなりません

(a) yadda 
(b) yadda 
(b-1) yadda 
(b-2) yadda 
(c) yadda 
(d) yadda 

Answer 1

はHTMLで注文リストを作成するには：一つの特色は、あなたが、時々このようなリストが表示されますということです。

<ol> 
    <li>yadda</li> 
    <li>yadda</li> 
    <li> 
    <ol> 
     <li>yadda</li> 
     <li>yadda</li> 
    </ol> 
    </li> 
    <li>yadda</li> 
</ol> 

ここでは例を参照してください：あなたはこの質問を見て持つことができます

https://jsfiddle.net/jruizx/pcs2mh4j/

：

Can ordered list produce result that looks like 1.1, 1.2, 1.3 (instead of just 1, 2, 3, ...) with css?

Answer 2

は、あなたが使用できる擬似要素を::beforeとCSS counters

ul { 
 
    counter-reset: list, list2, list3; 
 
} 
 
li { 
 
    list-style: none; 
 
    counter-increment: list; 
 
} 
 
li::before { 
 
    content: "(" counter(list, lower-alpha)")"; 
 
    position: relative; 
 
    left: -5px 
 
} 
 
li:nth-child(3) { 
 
    counter-increment: list2 2 
 
} 
 
li:nth-last-child(2) { 
 
    counter-increment: list3 3 
 
} 
 

 
li:nth-child(3)::before { 
 
    content: "(" counter(list2, lower-alpha)"-1)"; 
 
} 
 
li:nth-child(4)::before { 
 
    content: "(" counter(list2, lower-alpha)"-2)"; 
 
}

<ul> 
 
    <li>Some text here</li> 
 
    <li>Some more text here..</li> 
 
    <li>Oh yeah, here's some pretty text</li> 
 
    <li>Some text here</li> 
 
    <li>Some more text here..</li> 
 
    <li>Oh yeah, here's some pretty text</li> 
 
</ul>