2014-04-30 27 views
1

是否可以在有序列表輪廓的頂層顯示只有十進制數字而不是全部數字?例如:僅用於兒童列表項目的CSS計數器

<ol> 
<li>Item 
    <ol> 
     <li>Item</li> 
     <li>Item</li> 
     <li>Item</li> 
    </ol> 
</li> 
<li>Item 
    <ol> 
     <li>Item</li> 
     <li>Item</li> 
     <li>Item</li> 
    </ol> 
</li> 
<li>Item</li> 
<li>Item</li> 

CSS

ol { 
    counter-reset: section;     
    list-style-type: none; 
} 

li:before { 
    counter-increment: section;             
    content: counters(section,".") " "; 
} 

這將顯示一個類似的列表:

  1. 項目
          1.1項目
          1.2項目
          1.3項目

我想實現的是:

項目
      1.1項目
      1.2項目
      1.3項目

這裏是一個小提琴我一直想的東西出來有:
http://jsfiddle.net/Py7k8/

回答

4
ol { 
    counter-reset: section;     
    list-style-type: none; 
} 
li:before { 
    counter-increment: section;             
    content: ""; 
} 
li ol li:before {            
    content: counters(section,".") " "; 
} 

DEMO

+0

就是這樣。謝謝! –