List Unordered
Standard unordered <ul>
lists. For more options and control over bullet styles, use list-bullet.
ul
- List item level 1
- List item level 1 lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi suscipit autem accusantium quibusdam reiciendis incidunt sed, amet perspiciatis, sequi cum aperiam sunt excepturi corporis.
- List item level 2
- List item level 2 lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores consectetur, dolore laboriosam, porro cumque optio? Aliquid aperiam expedita, magni, cum ex, quaerat veritatis pariatur quibusdam nostrum omnis, suscipit itaque beatae.
- List item level 2
- List item level 2
- List item level 3
- List item level 3
- List item level 1
- List item level 1
<ul>
<li>List item level 1</li>
<li>List item level 1 lorem ipsum dolor sit amet, consectetur adipisicing elit.
Nisi suscipit autem accusantium quibusdam reiciendis incidunt sed, amet perspiciatis,
sequi cum aperiam sunt excepturi corporis.</li>
<ol>
<li>List item level 2</li>
<li>List item level 2 lorem ipsum dolor sit amet, consectetur adipisicing elit.
Asperiores consectetur, dolore laboriosam, porro cumque optio? Aliquid aperiam expedita,
magni, cum ex, quaerat veritatis pariatur quibusdam nostrum omnis, suscipit itaque beatae.</li>
</ol>
<ol>
<li>List item level 2</li>
<li>List item level 2</li>
<ol>
<li>List item level 3</li>
<li>List item level 3</li>
</ol>
</ol>
<li>List item level 1</li>
<li>List item level 1</li>
</ul>
These are nested unordered <ul>
lists. Create <ul>
tags that contain <li>
tags.
ul
- list item 1
- list item 2
- list item 3
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
</ul>
Default <ul>
unordered list without a class. Create a <ul>
tag that contains <li>
tags.
list-circle
- list item 1
- list item 2
- list item 3
<ul class="list-circle">
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
</ul>
Create a <ul>
tag that contains <li>
tags, and apply the list-circle
class.
list-disk
- list item 1
- list item 2
- list item 3
<ul class="list-disk">
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
</ul>
Create a <ul>
tag that contains <li>
tags, and apply the list-disk
class.
list-square
- list item 1
- list item 2
- list item 3
<ul class="list-square">
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
</ul>
Create a <ul>
tag that contains <li>
tags, and apply the list-square
class.