HTML tutorial: ordered LIST _ HTML/Xhtml _ webpage Creation

Source: Internet
Author: User
Tags arabic numbers
Original article: the last section of andymao.comandypost103.html: unordered list information is sometimes unordered, but some have a clear order, which is also mentioned in the previous article. In a simple way, let's take a look at the following things in sequence: operation steps, rankings, book directories & hellip; in the past, we were faced with these sequential or numbers: http://andymao.com/andy/post/103.html
Previous section: Unordered list
Information is sometimes unordered and summarized, but some have a clear order, which is also mentioned in the previous article. In a simple way, let's take a look at the following things in sequence: operation steps, rankings, book directories ...... In the past, we used to add a numerical value before the data, or add the value by the program. However, if you use an ordered list, you do not need to enter the ordinal number at all. This feature does not seem obvious when you use a single-layer list, when multiple layers are used, their features are obvious. Let's take a look at the code format of the ordered list first:

  1. This is the content of the list. This is the first sentence.

  2. This is the list content. This is the second sentence.

  3. This is the content of the list. This is the third sentence.

  4. This is the content of the list. This is the fourth sentence.

  5. This is the list content. This is the fifth sentence.


As you can see, this format is the same as that of the unordered list, except that the name of the peripheral tag is different. Disorder is UL, and order becomes OL. The difference is that the ordered list will have more tag attributes than the unordered list. Because it is ordered, it involves all aspects of order.
Change start value
Generally, the browser Automatically sorts the numbers starting from the Arabic numerals "1. In special cases, when the ordered list needs to be changed to two parts, the next person is numbered from the beginning. Then the number of the next part is to add 1 as the start number based on the last number in the previous section. This means that we need to change the starting value of the list. The attribute for changing the start value is: "start", which is officially written as follows:

  1. This is the content of the list. This is the first sentence.

  2. This is the list content. This is the second sentence.

  3. This is the content of the list. This is the third sentence.

  4. This is the content of the list. This is the fourth sentence.

  5. This is the list content. This is the fifth sentence.


As you can see, the above Code indicates that the starting value of the list starts from 6. Now, you can try to add this attribute to an ordered list to see if it has changed?
Change ID type
By default, the browser uses Arabic numbers as the list numbers. Is there any other type? Yes. The attribute is "type", but there are not many types available. There are only five types:
Type Value Generate Style Sequence exampleA upper case letters A, B, C, D, E a lower case letters a, B, c, c, e I upper case roman numerals I, II, III, IV, V I lower case roman numerals I, ii, iii, iv, v 1 Arabic numerals 1, 2, 3, 4, 5
The Code should be written as follows:

  1. This is the content of the list. This is the first sentence.

  2. This is the list content. This is the second sentence.

  3. This is the content of the list. This is the third sentence.

  4. This is the content of the list. This is the fourth sentence.

  5. This is the list content. This is the fifth sentence.


I think it is better to use this type value less, because this type can be set like CSS. I have always advocated that style language should be used for style affairs. This attribute is not required unless otherwise specified. Of course, neither CSS1 nor CSS2 has basically considered China. In CSS2, Japanese serial numbers are provided, but Chinese characters are not yet available. I think CSS2 is still flawed at this point, at least it does not provide a better extension form. Although he did not provide it, we can also achieve diversification in our own form. How can this problem be solved? Let us first think about how to deal with the list style content.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.