Home >Web Front-end >HTML Tutorial >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
c34106e0b4e09414b63b2ea253ff83d6 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
<ol reversed="reversed"> 这个是继承自XHTML的写法,其实可以直接写 <ol reversed>This already complies with the HTML5 standard. After adding this, you can get the result like this
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!