Lists

Unordered List

The unordered list is a very commonly used tag in web development. It’s main purpose is to create a bulleted list of items.

Here is a basic example:

<ul>
  <li>List Item 1</li>
  <li>List Item 2</li>
  <li>List Item 3</li>
</ul>

• List Item 1
• List Item 2
• List Item 3

The <ul> tag stands for unordered list. The <li> tags are list items.

The ul tag is used quite often to indent a block of text or code. Recently, many menus on websites are created using unordered lists and css. This method not only produces less code, but it’s easier to manage than using tables.

Ordered List

The ordered list is very similar to the unordered list. Instead of using the <ul> tag, the <ol> tag is used. The <li> list item element tags are used in the same way as the unordered list. An ordered list resembles an outline.

<ol>
  <li>List Item 1</li>
  <li>List Item 2</li>
  <li>List Item 3</li>
</ol>

1. List Item 1
2. List Item 2
3. List Item 3

Definition List

The purpose of a definition is exactly as it implies. It is used to display terms and their definitions in a list type format. A definition list is defined by the <dl> tag. Inside the dl tags, the <dt> tag defines a definition term, while the <dd> tag defines the definition for the term.

<dl>
  <dt>HTML</dt>
  <dd>Hypertext Markup Language</dd>
  <dt>CSS</dt>
  <dd>Cascading Style Sheets</dd>
  <dt>PHP</dt>
  <dd>Hypertext Preprocessor</dd>
</dl>

HTML

Hypertext Markup Language

CSS

Cascading Style Sheets

PHP

Hypertext Preprocessor

Popularity: unranked [?]