HTML Coding Tips

The more HTML coding you know the better you can make your web pages. One you are familiar with the HTML head section tags it's time for you to learn some of the other should-know tags.

Once learn these widely used HTML codes and see how they are used your HTML comfort level will probably increase. I believe that because it happened to me -- you'll be fine.

Tags for Lists

There are three types of lists that can be done with HTML:

• unordered lists
• ordered lists
• definition lists

<ul> ... </ul>

The ul tag specifies an unordered type list. By default, the list items are preceded by a round bullet.

With the TYPE attribute you can specify what type of bullet you want place in your text.

Values for this attribute are "circle", "square", and "disc" and are incorporated in the ul tag in this fashion…

<ul type="square">

Within the ul tags, each item in a list is preceded with the list item tag, <li>.

For example, if I wanted to list grapes, apples, and peaches on-line, your html file would look like this:

<ul><li>grapes</li><li>apples</li><li>peaches</li></ul>

Would look like:

 grapes apples peaches

<ol> ... </ol>

The ol tags represent the ordered type lists. It is set up in your html file like the ul tags. By default, the list is ordered by numbers.

You can, however, change this by using the TYPE attribute. Letters can be uppercase [type="A"], lowercase [type="a"], small roman numerals [type="i"], or large roman numerals [type="I"].

An ordered list with lowercase letters would look like this:

<OL type="a">

<dl> ... </dl>

Definition lists are set up differently than the ordered and unordered lists.

Instead of using a list item tag, <li>, to separate the list items, the <dt> or the <dd> tags can be used.

The <dt> or definition term tag does NOT indent the item. The <dd> or definition description tag indents the item.

As an example, if I wanted to use the fruit items list from above, it would look like this:

<dl><dt>Fruits that I love:</dt> <dd>grapes</dd> <dd>apples</dd> <dd>peaches</dd></dl>

Would look like:

Fruits that I love:

grapes applespeaches

"Fruits that I love" would not be indented but, grapes, apples, and peaches would be indented.

For this tutorial, I used the <dl> and <dd> tags.

Return from HTML Coding.