HTML&CSS Basic Learning Note 14-sequence lists and list nesting

We talked about unordered lists in the last chapter, so let's take a look at the list of sequential tables and their combinations.

Ordered list

Now we're going to do the chores, but what's the first thing we can do to find so many chores? So we sort of prioritize this mess, so we can do it in order. The list item in HTML that uses <ol> tags to denote the,<ol> label of the sequence list is still represented by the <li> tag.

Its code template is this:

<span style= "Font-family:microsoft Yahei;" ><ol> <li></li> <li></li> ... </ol></span>

Let's see what his specific code implementation looks like:

<! DOCTYPE html> 
The browser results are:
650) this.width=650; "Src=" Http://s2.51cto.com/wyfs02/M01/87/1D/wKiom1fUtxWBjs1qAAAlGJT6WUE311.png-wh_500x0-wm_3 -wmp_4-s_3186581780.png "title=" 2.png "alt=" Wkiom1futxwbjs1qaaalgjt6wue311.png-wh_50 "/>
List nesting
We know that tags can be nested, so lists can also be nested. When some list items in our list are lists, we can use nesting.
Now let's look at an example of how unordered and ordered lists are nested:
<! Doctype html>  
What is the result? Go to the http://www.mayacoder.com/lesson/lesson?lesson_id=31&knowledge_id=4 experience to see it.
The results are as follows:
650) this.width=650; "Src=" Http://s1.51cto.com/wyfs02/M01/87/1B/wKioL1fUtyCAZDkMAAAYt0Cngpg225.png-wh_500x0-wm_3 -wmp_4-s_2551570162.png "title=" 3.png "width=" height= "340" border= "0" hspace= "0" vspace= "0" style= "width:180px; height:340px; "alt=" Wkiol1futycazdkmaaayt0cngpg225.png-wh_50 "/>

HTML&CSS Basic Learning Note 14-sequence lists and list nesting