Home > Developer > Web Develop
1. Ordered list
A numbered list is used to number content in a Web page so that the reader can clearly understand the order of each line. Inserting an ordered list in HTML is achieved by <ol> and <li> tags. The content between the first label <ol> and the tail label </ol> is the contents of the sequence table, and each item of the list must be included between <li> and </li>.
The syntax format for a sequence table is as follows:
<ol>
<li> list Item 1</li>
<li> list Item 2</li>
.........
<li> list Item n</li>
</ol>
Description The:<ol> tag has two properties: the Type and Start,type properties are used to specify the style of the numeric number. The Start property is used to specify the starting number, and if the Start property is not set, Arabic numerals are used by default, starting with 1.
The value and meaning of the type attribute and start property are as follows:
Type= "1" start= "10" numbering with Arabic numerals, starting with Arabic numerals 10
Type= "A" start= "B" numbers in lowercase English letters, starting from letter B
Type= "A" start= "K" numbers in uppercase letters, starting with capital letter K
Type= "I" numbered in lowercase roman numerals
Type= "I" numbering with uppercase Roman numerals
Example: A sequence list exercise
<body>
<ol type= "A" >
<li><font color= "#0000ff" size= "4" face= "Song Body" > The birds on the tree are noisy </font></li>
<li><font color= "#0000ff" size= "4" face= "Song Body" > Fish in the water is silent </font></li>
<li><font color= "#0000ff" size= "4" face= "Song Body" > Heavenly clouds are drifting </font></li>
<li><font color= "#0000ff" size= "4" face= "Song Body" > People on the ground are lonely </font></li>
</ol>
<body>
2. Ordered list
An unordered list is a list of items that can be sorted in any order. List items are marked with a specific symbol instead of consecutively numbered, usually preceded by a dot in front of each list item. Unordered lists are similar to the implementation of ordered lists, except that they are marked <ul> instead of the <ol> in a sequential list.
The syntax format for unordered lists is as follows:
<ul>
<li> list Item 1</li>
<li> list Item 2</li>
.........
<li> list Item n</li>
</ul>
Description The:<ul> tag has the type attribute, which is used to set the bullet type, with the following 3 types of property values:
Type= "disc" sets the bullet style to be a dot.
Type= "Circle" sets the bullet style to circle.
Type= "Square" sets the bullet style to rectangular.
Example: Unordered list Practice
<body>
<ul type= "Square" >
<li><font color= "#0000ff" size= "4" face= "Song Body" > The birds on the tree are noisy </font></li>
<li><font color= "#0000ff" size= "4" face= "Song Body" > Fish in the water is silent </font></li>
<li><font color= "#0000ff" size= "4" face= "Song Body" > Heavenly clouds are drifting </font></li>
<li><font color= "#0000ff" size= "4" face= "Song Body" > People on the ground are lonely </font></li>
</ul>
</body>
3. Defining the list
The definition list is used for a short description of the manifest entry, the list item is labeled <dt> guided, and the description of the list item is tagged <dd> guided, with the first label <dl> and the tail label </dl> the listing content. Usually <dt> and <dd> come together. A list item can correspond to a description item, or it can correspond to more than one description item.
Each list item in the definition list has an indented description item in the same format as the dictionary, so it is also referred to as the dictionary list.
The syntax format for the definition list is as follows:
<dl>
<dt> list Items 1</dt>
<dd> Description 1</dd>
<dd> Description 2</dd>
.........
<dt> list Items 2</dt>
<dd> Description 1</dd>
<dd> Description 2</dd>
.........
.........
</dl>
Example: Define a list exercise
<body>
<font color= "#0000ff" size=4 face= "blackbody" > Computer network Classification </font>
<dl>
<dt><font color= "#ff0000" size=2 face= "song body" > Lan </font></dt>
<dd><font color= "#ff0000" size=2 face= "song Body" >lan (LOcal area Network) </font></dd>
<dd><font color= "#ff0000" size=2 face= "song body" > Small area use, low cost and easy management </font></dd>
</dl>
<dl>
<dt><font color= "#ff0000" size=2 face= "song body" > Wan </font></dt>
<dd><font color= "#ff0000" size=2 face= "song Body" >wan (Wide arae Network) </font></dd>
<dd><font color= "#ff0000" size=2 face= "song Body" >internet is a typical WAN </font></dd>
</dl>
<dl>
<dt><font color= "#ff0000" size=2 face= "song body" > Metropolitan Area Network </font></dt>
<dd><font color= "#ff0000" size=2 face= "song Body" >man (Metropolitan area Network) </font></dd>
<dd><font color= "#ff0000" size=2 face= "Arial" > coverage geographic range between LAN and WAN </font></dd>
</dl>
</body>
Detailed HTML List
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
