How to use ol tag in HTML5

In this article Xiaobian for you to introduce in detail "how to use the ol tag in HTML5", the content is detailed, the steps are clear, and the details are handled properly. I hope that this article "how to use the ol tag in HTML5" can help you solve your doubts.

Definition and usage

The tag defines an ordered list.

Differences between HTML 4.01 and HTML 5

In HTML 4.01, the "start" attribute is deprecated and is allowed in HTML 5.

In HTML 4.01, the "compact" and "type" attributes are deprecated, and they are no longer supported in HTML 5.

Tips and comments

Tip: use CSS to define the type of list.

Examples

XML/HTML Code copies content to the clipboard

Coffee

Tea

Coffee

Tea

OL tag serial number control provided by HTML5

The OL tag displays the data in the form of an ordered list, and it automatically numbers the data. But sometimes the data is not numbered from 1, or the numbers are in reverse order, or the numbers are completely messy, so you need to use some of the parameters provided for the OL tag in HTML5. Unfortunately, it is not yet compatible with IE.

Now, we have an HTML document like this

XML/HTML Code copies content to the clipboard

Potato

onion

Carrot

Tenderloin meat

It will look like this.

These serial numbers are incremented from 1 by default. What if you need to reverse the sequence numbers in the OL tag? All you have to do is add a reserved attribute to OL.

XML/HTML Code copies content to the clipboard

This is inherited from XHTML, but you can actually write it directly.

This is already in line with the standard of HTML5, and you can get such a result by adding this.

Both Chrome and Firefox are fine, but IE is not compatible with it (at least I tested that IE10 is not compatible). Well, we only know about this function now, but we won't discuss it for the time being whether IE is actually implemented or not.

And then, what if you don't want it to start with 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 copies content to the clipboard

Finally, what about something that is completely irregular but orderly? For example, I want 2, 1, 3, 4, what about this arrangement? In fact, you can control this sequence number simply by adding the value attribute to LI.

XML/HTML Code copies content to the clipboard

Potato

onion

Carrot

Tenderloin meat

Read here, this article "how to use ol tags in HTML5" article has been introduced, want to master the knowledge of this article also need to practice and use in order to understand, if you want to know more about the article, welcome to follow the industry information channel.