I have following list of elements:
<ol>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>
I want to display the list starting from 'C', like this:
C First item
D Second item
E Third item
Is it possible? Does the list always have to start from '1', 'a', 'A', etc?
There is a start value that can be defined on your list item alongside a type.
<ol type="A" start="3">
This is the passage taken from http://www.w3.org/TR/html4/struct/lists.html.
start = number Deprecated. For OL only. This attribute specifies the starting number of the first item in an ordered list. The default starting number is "1". Note that while the value of this attribute is an integer, the corresponding label may be non-numeric. Thus, when the list item style is uppercase latin letters (A, B, C, ...), start=3 means "C". When the style is lowercase roman numerals, start=3 means "iii", etc.
And you can experiment yourself using http://www.w3schools.com/TAGS/tryit.asp?filename=tryhtml_ol_start
Use
<ol type="1" start="n">
to start a new list at the desired number, where n is your desired start.
The HTML spec says there's a start attribute to <ol>, but it's deprecated. There's a value attribute to <li> which is deprecated as well. Not quite sure why and what's the suggested solution.
As already noted, you have to use <ol start="number">, but it is deprecated in HTML 4.01 and is not supported in XHTML Strict.
Currently, there is no CSS Alternative.
You can use this trick, tested on Firefox, IE6, IE7, Chrome, Safari, Opera :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<style type="text/css">
li.hidden { list-style: none; position: absolute; }
</style>
</head>
<body>
<ol>
<li class="hidden"></li>
<li class="hidden"></li>
<li class="hidden"></li>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>
</body>
</html>
Basically, any css style besides "display:none" that prevents the list items from being visible will do the work.
You can avoid using the the <ol type="1" start="3"> notation if you like, since it is, as noted, deprecated in HTML 4.01*. The downside is that the replacement technique isn't that universal, regardless:
ol.start-from-three {
list-style-type: none;
counter-reset: list-counter 3; /* resets the counter to 3 */
}
ol.start-from-three li {
}
ol.start-from-three li:before { /* or :after, if you like */
content: "number: counter(list-counter)";
counter-increment: list-counter;
}
<ol class="start-from-three">
<li>This is the first item, numbered third</li>
<li>This is the second item, numbered fourth</li>
<li>...etc...</li>
</ol>
Of course those browsers that will interpret this technique (from Quirksmode) will allow both the deprecated and CSS version. So...maybe, use some form of conditional if you need validation?
Edited to amend my original assertion that "<ol type="1" start="3"> is deprecated in html 4.01+", ms2ger raised the point, in the comments below, that it was deprecated only in html 4.01, html 5 (for example) allows the start="n" notation to be used