Detailed explanation of the usage of ol tag in html5

This article mainly introduces the usage of ol tag in HTML5, which is the basic knowledge for introductory learning of HTML5. Friends in need can refer to the definition and usage of

Tags define an ordered list.
Differences between HTML 4.01 and HTML 5
In HTML 4.01, the use of "start" attribute is deprecated, in HTML 5 it is allowed.
In HTML 4.01, the "compact" and "type" attributes were deprecated, and in HTML 5, these two attributes are no longer supported.
Tips and Comments
Tip: Please use CSS to define the type of the list.
Example

<ol>
   <li>Coffee</li>
   <li>Tea</li>
</ol>
<ol>
   <li start="60">Coffee</li>
   <li>Tea</li>
</ol>

• 
  



##The OL tag sequence number provided by HTML5 The control
OL tag displays data in the form of an ordered list, and it automatically adds numbers to the data. But sometimes the data is not numbered starting from 1, or the numbers are arranged in reverse order, or the numbers are completely messy. In this case, you need to use some parameters provided for the OL tag in HTML5 to set. Unfortunately, it is currently not compatible with IE. Now, we have a
HTML document like this

<ol>
  <li>土豆</li>
  <li>洋葱</li>
  <li>胡萝卜</li>
  <li>里脊肉</li>
</ol>

It will appear like this




These serial numbers start from 1 and increase by default. What if you need to arrange the serial numbers in the OL tag in reverse order? This just needs to add a reserved attribute to OL.

<ol reversed="reversed">
　　这个是继承自XHTML的写法，其实可以直接写   
<ol reversed>

This already complies with the HTML5 standard. After adding this, you can get the result like this




There is no problem in Chrome and Firefox, but IE It is not compatible with it (at least I tested IE10 which is not compatible). Well, we are just learning about this function now. As for whether IE actually implements it, we will not discuss it for the time being.

Next, what if you don’t want it to start from 1? For example, if we want it to start from 3, we can add the start attribute to the OL tag and set it to 3.


<ol start="3">



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

  <ol>
  <li value="2">土豆</li>
  <li value="1">洋葱</li>
  <li value="3">胡萝卜</li>
  <li value="4">里脊肉</li>
</ol>



The above is the detailed content of Detailed explanation of the usage of ol tag in html5. For more information, please follow other related articles on the PHP Chinese website!