Detailed HTML5 the usage of OL label

Definitions and usage

<ol> label has a sequence table defined.

the difference between HTML 4.01 and HTML 5
In HTML 4.01, it is not favoured to use the "start" attribute, which is allowed in HTML 5.
In HTML 4.01, the "compact" and "type" attributes are not favoured, and the two properties are no longer supported in HTML 5.
Tips and comments
Tip: Use CSS to define the type of list.


Example

xml/html code to copy content to clipboard

1. <ol>
2. <li>Coffee</li>
3. <li>Tea</li>
4. </ol>
6. <ol>
7. <li start= ">Coffee</li>"
8. <li>Tea</li>
9. </ol>

HTML5 provides the OL label ordinal control
OL This label is the form of an ordered list to display the data, it will automatically add numbers to the data. But sometimes the data is not numbered from 1, or the numbers are sorted in reverse order, or the numbers are completely cluttered, and you need to use some of the parameters provided by the Ol tab in HTML5 to set up. Unfortunately, it is not compatible with IE at the moment.
Now, we have an HTML document like this

xml/html code to copy content to clipboard

1. <ol>
2. <li> potatoes </li>
3. <li> Onion </li>
4. <li> Carrots </li>
5. <li> Pork Fillet </li>
6. </ol>

It will show up like this

These ordinals are incremented by default starting from 1. What if you need to order the ordinal in the ol label? This just adds a reserved attribute to ol.

xml/html code to copy content to clipboard

1. <ol reversed= "Reversed" >
2. This is inherited from the XHTML writing, in fact, you can write directly
3. <ol reversed>

This is already in line with HTML5 's standards, and this can be followed by this result

Both Chrome and Firefox are fine, but IE is not compatible with it (at least I tested IE10 is incompatible). Well, now we just understand this function, as for IE is not implemented for the time being no longer discussed.
And then, what if you don't want it to start at 1? For example, to start with 3, we can add the start attribute to the OL tag and set it to 3.

xml/html code to copy content to clipboard

1. <ol start= "3" >

Finally, how do you do something that is completely irregular but orderly? For example I want 2, 1, 3, 4, such arrangement how to do? In fact, as long as the Li plus the value attribute can control this number.

xml/html code to copy content to clipboard

1. <ol>
2. <li value= "2" > Potato </li>
3. <li value= "1" > Onion </li>
4. <li value= "3" > Carrot </li>
5. <li value= "4" > Tenderloin </li>
6. </ol>