[英]HTML Ordered List as the following 1.0, 1.1, 1.1.1, 2.0, 2.1, 2.1.1
您能幫我創建一個有序列表嗎，該列表的最高排序項是1.0、2.0、3.0等。
這是現有的小提琴-http: //jsfiddle.net/PTbGc/632/
我正在使用的列表CSS是
OL { counter-reset: item; padding-left: 10px; } LI { display: block; } LI:before { content: counters(item, ".") " "; counter-increment: item }
子列表順序正確。 我只想讓頂級列表以.0結尾
謝謝。
看一下這個小提琴 ，我設法通過在計數器之前使用一個計數器來獲得想要的東西。
編輯：由於有很多人比直接html標簽更喜歡類（包括我），所以我創建了另一個小提琴 ，用css類來顯示概念。 最好的解決方案是像在小提琴中那樣將兩種技術混合在一起，這就是我將使用的方式。
CSS是
/* selector for the first level of the nested list */
BODY > OL {
/* reset the item counter when a new nested list starts
e.g. everytime there is a <ol> tag as a direct child of the <body> */
counter-reset: item;
padding-left: 10px;
}
/* selector for the list items on the first level */
BODY > OL > LI::before {
/* prepend X.0 to the content of every list item that is a direct
child of <ol> which is a direct child of the <body> */
content: counter(item) ".0 ";
counter-increment: item
}
/* selector for all sublists */
LI > OL {
padding-left: 10px;
/* when entering a new sublist reset the subitem counter */
counter-reset: subitem;
}
/* selector for the items of in every sublist */
LI > OL > LI::before {
/* prepend the current value of the item counter and the subitem
counters to the content of each <li> tag in a sublist. */
content: counter(item) "." counters(subitem, ".") " ";
counter-increment: subitem
}
Html 有序列表 1.1、1.2（嵌套計數器和范圍）不起作用
[英]Html ordered list 1.1, 1.2 (Nested counters and scope) not working
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.