Here's a good online reference for Lists.
Here's the official word from W3.org on HTML 4.01 lists. Note that some attributes are deprecated.
Normally, a list (and other block elements) is separated from other block elements by a blank line. This spacing can be increased, reduced or eliminated using CSS style="margin-top:#px; margin-bottom:#px;" (where # is an integer for number of pixels) in the list element and <p style="margin-bottom:#px;"> for the paragraph (or other block element above our list; and if necessary, the corresponding style="margin-top:#px;" in the following block element. The separation between list elements can be increased by using an integer other than zero; 5 or 10 px separates list elements nicely. Also, since lists are block elements, they are not allowed inside other block elements (such as <p></p>), where they may be rendered unexpectedly, and will not validate. Nested lists are allowed, however.
It's a good idea to add the optional TITLE attribute to lists, as for example, <ul title="A nice descriptive title">. That descriptive text gives valuable information to visitors using assistive technologies like screen readers.
UL Attributes: type determines the shape of the bullet, compact (recognized by some browsers) renders the list in a more compact form.
<ul type="[Disc|Square|Circle]" compact="compact" title="A nice descriptive title"> (nothing allowed here)
<li>[Bulleted List items go here]</li>
<li>[Bulleted List items go here]</li>
</ul>
and here's the list using the disc bullet and compact structure following </p>:
The next paragraph would start here (if there is not much different from the default, COMPACT is unsupported.
OL Attributes type="[1: decimal numbers (1, 2, 3, 4, 5)|a: lowercase alphabet characters (a, b, c, d, e)|A: uppercase alphabet characters (A, B, C, D, E)|i: lowercase Roman numerals (i, ii, iii, iv, v)|I: uppercase Roman numerals (I, II, III, IV, V)]" start="#" compact="compact" title="A nice descriptive title"
Here is the code
<ol type="I" start="4" title="A nice descriptive title"> (nothing allowed here)
<li>[Numbered List items go here]</li>
<li>[Numbered List items go here]</li>
</ol>
and here's the list using uppercase Roman numerals, start="4":
The <li> element is used by Ordered and Unordered lists; the kind of list determines the rendering of the list element marker. Be sure to use the appropriate attribute type for the kind of list! Type start="#" does not make sense in an Unorded list.
Use type="[Disc|Square|Circle]" at the List level to change the Type defined for a UL tag.
Use type= "[1|a|A|i|I" to change an OL tag; start="#" will reset the number of a OL series to begin with # (use a numeral!).
<li type="[1|a|A|i|I]"|"[Disc|Square|Circle]" start="#">list element text</li>
The browser chooses a default bullet for each level unless a bullet or number style is explicitly defined. Here is the code for nested lists
<ol>
<li>Beginning of Ordered list - First item, #1 note: do not close the list tag (</li>) in front of the next nested list!
<ul>
<li>Beginning of nested Unordered list - First item in the nested list, bulleted</li>
<li>Second item in the nested list, bulleted</li>
<li>Third item in the nested list, bulleted</li>
</ul>
<li>Second Ordered item, #2</li>
</ol>
and here is what the list looks like:
definition list tag ( <dl>[contains the terms and definitions]</dl> ) begins and ends the list, and tells the browser to render a definition list. Do not put anything between the <dl> tag and the first <dt> tag, nor between the closing and opening of other tags. Closing tags are required by XHTML, but optional in HTML. The attribute compact="compact" may be rendered in a more compact form by some browsers.
definition term tag ( <dt>Term to be defined</dt> ) identifies terms in the list
definition description tag ( <dd>Definition of the Term</dd> ) identifies a description to go along with the term
Here is the code to create a Definition list
<dl>
<dt>HTTP</dt>
<dd>Hypertext Transfer Protocol</dd>
<dd>The protocol that allows Web browsers and Web servers to communicate with one another.</dd>
<dt>SMTP</dt>
<dd>Simple Mail Transfer Protocol</dd>
<dd>The protocol that allows e-mail clients and e-mail servers to communicate with one another when sending mail.</dd>
</dl>
and here is the resulting Definition list:
![]()