HTML：如何創建一個numerated指數

可能重複：
Number nested ordered lists in HTML
HTML: ordered sublists HTML：如何創建一個numerated指數

我想創建一個numerated指數：

1.0

1.1

1.1.1

1.1.2

1.1.3

1.2

2.0

2.1

2.2

什麼是最好的方式噸o這樣做？ ul，ol？

<ul> 
<li><span>1.0</<span>First entry</li> 
<li><span>1.1</<span>Second entry</li> 
</ul>

來源

2012-03-29 bodokaiser

去看看你原來的問題你貼早一些。我回答說。 – ScottS 2012-03-29 18:31:26

@ScottS：是什麼讓你認爲這兩個問題背後都是同一個用戶？他們非常相似，是的;但這可能只是巧合。 – 2012-03-29 18:35:06

@ DavidThomas - 因爲它是相同的用戶數（user1246987）:-) – ScottS 2012-03-29 18:36:44

你不需要的跨度，除非你explisitly希望將其標記的東西，對於造型等等你所做的接縫細小，除非你需要做不同的東西從它做什麼現在。如果你只是想讓它枚舉1,2,3等，那麼你可以使用ol而不是ul。

來源

2012-03-29 18:29:01

1.0首先進入
1.1第二個條目
1.2第二個條目

你好，是的，我想用在跨度設置造型等於默認OL列表。我選擇使用靜態解決方案，因爲我的眼睛中的動態不是cosher :( – bodokaiser 2012-03-29 19:30:09

您正在尋找的東西很容易用css進行計數。你不需要再自己寫數字了。

讀here

來源

2012-03-29 18:31:28

嗨，你可以做，我給你舉例

CSS

body{ 
    counter-reset:section; 
} 
div{ 
    margin-top:10px;margin-left:10px; 
} 
.numercal { 
    counter-reset:subsection; 
    font-weight:bold; 
} 
.numercal:before{ 
    counter-increment:section; 
    content:"Section " counter(section) ". "; 
    font-style:italic; 
    color:red; 
} 
.numercal-no:before{ 
    counter-increment:subsection; 
    content:counter(section) "." counter(subsection) " "; 
}

HTML

<div> 
    <p class="numercal">Demo Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
</div> 


<div> 
    <p class="numercal">Demo Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
</div> 




<div> 
    <p class="numercal">Demo Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
    <p class="numercal-no">Sub Text here</p> 
</div>

直播d EMO click here http://jsfiddle.net/rohitazad/Xwm3C/1/

現在更多關於此去這個網站http://reference.sitepoint.com/css/counter-increment

http://www.w3.org/wiki/CSS/Properties/counter-increment

來源

2012-03-30 11:36:26

HTML：如何創建一個numerated指數

回答

相關問題