Lists

Unordered bullet list

  • Suspendisse a pellentesque dui, non felis.
  • Quisque lorem tortor fringilla sed.
  • Quisque cursus et, porttitor risus.
  • Nulla ipsum dolor lacus, suscipit adipiscing.

Ordered list

  1. Suspendisse a pellentesque dui, non felis.
  2. Quisque lorem tortor fringilla sed.
  3. Quisque cursus et, porttitor risus.
  4. Nulla ipsum dolor lacus, suscipit adipiscing.
<ul class="list">
<li>List item 1</li>
<li>List item 2</li>
</ul>
<ol class="list">
<li>List item 1</li>
<li>List item 2</li>
</ol>

Roman ordered list

  1. Suspendisse a pellentesque dui, non felis.
  2. Quisque lorem tortor fringilla sed.
  3. Quisque cursus et, porttitor risus.
  4. Nulla ipsum dolor lacus, suscipit adipiscing.

Alpha ordered list

  1. Suspendisse a pellentesque dui, non felis.
  2. Quisque lorem tortor fringilla sed.
  3. Quisque cursus et, porttitor risus.
  4. Nulla ipsum dolor lacus, suscipit adipiscing.
<ol class="list list_roman">
<li>List item 1</li>
<li>List item 2</li>
</ol>
<ol class="list list_alpha">
<li>List item 1</li>
<li>List item 2</li>
</ol>

Unordered tick list

  • Suspendisse a pellentesque dui, non felis.
  • Quisque lorem tortor fringilla sed.
  • Quisque cursus et, porttitor risus.
  • Nulla ipsum dolor lacus, suscipit adipiscing.

Unordered info list

  • Suspendisse a pellentesque dui, non felis.
  • Quisque lorem tortor fringilla sed.
  • Quisque cursus et, porttitor risus.
  • Nulla ipsum dolor lacus, suscipit adipiscing.
<ul class="list list_tick">
<li>List item 1</li>
<li>List item 2</li>
</ul>
<ul class="list list_info">
<li>List item 1</li>
<li>List item 2</li>
</ul>

Unordered warning list

  • Suspendisse a pellentesque dui, non felis.
  • Quisque lorem tortor fringilla sed.
  • Quisque cursus et, porttitor risus.
  • Nulla ipsum dolor lacus, suscipit adipiscing.

Unordered plus list

  • Suspendisse a pellentesque dui, non felis.
  • Quisque lorem tortor fringilla sed.
  • Quisque cursus et, porttitor risus.
  • Nulla ipsum dolor lacus, suscipit adipiscing.
<ul class="list list_warning">
<li>List item 1</li>
<li>List item 2</li>
</ul>
<ul class="list list_plus">
<li>List item 1</li>
<li>List item 2</li>
</ul>

Unordered minus list

  • Suspendisse a pellentesque dui, non felis.
  • Quisque lorem tortor fringilla sed.
  • Quisque cursus et, porttitor risus.
  • Nulla ipsum dolor lacus, suscipit adipiscing.

Unordered arrow list

  • Suspendisse a pellentesque dui, non felis.
  • Quisque lorem tortor fringilla sed.
  • Quisque cursus et, porttitor risus.
  • Nulla ipsum dolor lacus, suscipit adipiscing.
<ul class="list list_minus">
<li>List item 1</li>
<li>List item 2</li>
</ul>
<ul class="list list_arrow">
<li>List item 1</li>
<li>List item 2</li>
</ul>

Unordered help list

  • Suspendisse a pellentesque dui, non felis.
  • Quisque lorem tortor fringilla sed.
  • Quisque cursus et, porttitor risus.
  • Nulla ipsum dolor lacus, suscipit adipiscing.
<ul class="list list_help">
<li>List item 1</li>
<li>List item 2</li>
</ul>