Lists

Definition list

Definition List Title
This is a definition list division.
Show/hide markup
<dl>
    <dt>Definition List Title</dt>
    <dd>This is a definition list division.</dd>
</dl>

Definition list–inline

Short title
This is a definition list item.
Second title
This is a definition list item.
Show/hide markup
<dl class="inline">
    <dt>Short title</dt>
    <dd>This is a definition list item.</dd>
    <dt>Second title</dt>
    <dd>This is a definition list item.</dd>
</dl>

Ordered list

  1. List item 1
  2. List item 2
  3. List item 3
  4. List item 4
  5. List item 5
Show/hide markup
<ol>
    <li>List item 1</li>
    <li>List item 2</li>
    <li>List item 3</li>
    <li>List item 4</li>
    <li>List item 5</li>
</ol>

Unordered list

  • List item 1
  • List item 2
  • List item 3
  • List item 4
  • List item 5
Show/hide markup
<ul>
    <li>List item 1</li>
    <li>List item 2</li>
    <li>List item 3</li>
    <li>List item 4</li>
    <li>List item 5</li>
</ul>

Unordered list–no bullets

  • List item 1
  • List item 2
  • List item 3
  • List item 4
  • List item 5
Show/hide markup
<ul class="no-bullet">
    <li>List item 1</li>
    <li>List item 2</li>
    <li>List item 3</li>
    <li>List item 4</li>
    <li>List item 5</li>
</ul>

Unordered list–square

  • List item 1
  • List item 2
  • List item 3
  • List item 4
  • List item 5
Show/hide markup
<ul class="square">
    <li>List item 1</li>
    <li>List item 2</li>
    <li>List item 3</li>
    <li>List item 4</li>
    <li>List item 5</li>
</ul>

Unordered list–circle

  • List item 1
  • List item 2
  • List item 3
  • List item 4
  • List item 5
Show/hide markup
<ul class="circle">
    <li>List item 1</li>
    <li>List item 2</li>
    <li>List item 3</li>
    <li>List item 4</li>
    <li>List item 5</li>
</ul>