- 0 Talk
-
Ordered list
| This page uses content from Wikipedia. The original article was at Ordered list. The list of authors can be seen in the page history. As with HTML Wiki, the text of Wikipedia is available under the GNU Free Documentation License. |
In HTML an ordered list <ol> .. </ol> is a HTML element for a list of items where each item is automatically prefixed by an indication of its position in the list.
An unordered list <ul> .. </ul> is an HTML element for a list of items where each item is prefixed by a fixed symbol, or nothing.
A list-style-type implies the prefixes to be equal or changing, and overrides the distinction between ol and ul.
Examples: decimal (default list-style-type for ol):
<ol> <li>Amsterdam</li> <li>Rotterdam</li> <li>The Hague</li> </ol>
gives
- Amsterdam
- Rotterdam
- The Hague
List style types
Edit
Specifying a list-style-type:
lower-alpha:
<ol style="list-style-type: lower-alpha"> <li>Amsterdam</li> <li>Rotterdam</li> <li>The Hague</li> </ol>
gives
- Amsterdam
- Rotterdam
- The Hague
Similarly:
upper-alpha:
- Amsterdam
- Rotterdam
- The Hague
lower-roman:
- Amsterdam
- Rotterdam
- The Hague
upper-roman:
- Amsterdam
- Rotterdam
- The Hague
disc (default list-style-type for 1st-level ul):
- Amsterdam
- Rotterdam
- The Hague
circle (default list-style-type for 2nd-level ul):
- Amsterdam
- Rotterdam
- The Hague
square (default list-style-type for 3rd and higher level ul):
- Amsterdam
- Rotterdam
- The Hague
"none":
- Amsterdam
- Rotterdam
- The Hague
Starting value
Edit
A starting value (in decimal form) can be specified (naturally this has no effect if the prefix does not depend on the item's position in the list):
<ol start="2"> <li>Amsterdam</li> <li>Rotterdam</li> <li>The Hague</li> </ol>
gives
- Amsterdam
- Rotterdam
- The Hague
Similarly for the different style types and a starting value of 2:
list-style-type: lower-alpha
- Amsterdam
- Rotterdam
- The Hague
list-style-type: upper-alpha
- Amsterdam
- Rotterdam
- The Hague
List-style-type: lower-roman
- Amsterdam
- Rotterdam
- The Hague
List-style-type: upper-roman
- Amsterdam
- Rotterdam
- The Hague
Comparison with a table
Edit
Apart from providing automatic numbering, the numbered list also aligns the contents of the items, comparable with using table syntax:
<ol start="9"> <li>Amsterdam</li> <li>Rotterdam</li> <li>The Hague</li> </ol>
gives
- Amsterdam
- Rotterdam
- The Hague
<table> <col span="2" /> <tr><td align="right">9.</td><td>Amsterdam</td></tr> <tr><td align="right">10.</td><td>Rotterdam</td></tr> <tr><td align="right">11.</td><td>The Hague</td></tr> </table>
gives
| 9. | Amsterdam |
| 10. | Rotterdam |
| 11. | The Hague |
This non-automatic numbering has the advantage that if a text refers to the numbers, insertion or deletion of an item does not disturb the correspondence.