Wednesday 24 October 2012

Listing Tags


<LI>tag:
<LI> is a list tag. There are three main types of list.
  1. Unordered list
  2. Ordered list
  3. Definition list
v  Creating Unordered list:
Both ordered and unordered lists required start and end as well as the use of special element to indicate where each list item begins, i.e. the <LI>tag.
Unordered lists can be preceded by one of the several bullet style like a closed circle an open circle or square. The tags for unordered lists are <UL> & </UL>.

For example:<TITLE>Shopping List<TITLE>
<BODY>
<UL>
<LI>Eggs
<LI>Milk
<LI>Apples
</UL>
The list will be displayed as:
·         Eggs
·         Milk
·         Apples
Observe that the list-item element uses <LI> tag and actual content of list.
Both <UL> and <LI> have same set of attributes:
TYPE=”CIRCLE”
TYPE=”DISC”
TYPE=”SQUARE”
The CIRCLE attribute values are used for a hollow bullets, the DISC creates a solid bullet and SQUARE value renders a solid block. The default appearance for a list is with disc.
The </UL> tag is always require at the end of unordered lists. You can also use </LI>end of each list item.
For example,
<UL TYPE=”SQUARE”>
<LI>Hammer
<LI>Screwdriver
<LI TYPE=”CIRCLE”>screws
</UL>
It will displayed as:
  • Hammer
  • Screwdriver
o   Screws

One important aspect of lists is that you can nest one list inside another to create a sub list. The default operating of sub list .The default operating of sub list will vary from main list.
For example:
<UL>
<LI>Body
<UL>
<LI>Head
<LI>Hand
<UL>
<LI>Finger
<LI>Thumb
</UL>
</UL>

The display will be:
  • Body
o   Head
o   Head
§  Finger
§  Thumb
Creating ordered Lists:
Ordered lists can be preceded by Arabic numerals, upper case or lower case Roman numerals, or uppercase or lowercase alphanumeric characters. The tags for an ordered list are <OL>and </OL>.
For example:
<OL>
<LI>Milk
<LI>Bread
<LI>Cheese
</OL>
The list will appear as:
1.    Milk
2.    Bread
3.    Cheese
Here are the attributes that you can use with ordered lists:
TYPE=”I” (Arabic numbers)
TYPE=”a”(lowercase alphanumeric)
TYPE=”A” (Uppercase alphanumeric)
TYPE=”i” (Lower case Roman numbers)
TYPE=”I” (Lower case Roman numbers)
START=”X”
The START attribute allows you to establish the beginning of list’s number sequence.
For example:
<OL START =”5”> would start your ordered list’s numbering with the number five. when we are using ordered lists, the <LI> tag can use the VALUE attribute to make a particular list item have a certain number.
For example:
<LI VALUE = “10”>chocolate
It will be displayed as: 10.chocklate
You can make paragraphs, list of links and list of images also.

DEFINITION LIST:
The definition list element uses <DL> start tag and </DL> end tag to create a definition list. This list is rendered without bullets.<DT> tag is used for definition terms i.e.name or title of the item you are defining. The <DD>tag is used for the definition themselves.
For example:
<DL>
<DT>Term A
<DD>Definition of term A
<DT>Term B
<DD>Definition of term B
</DL>

This will be displayed as:
Term A
            Definition of term A
Term B
            Definition of term B

No comments:

Post a Comment