List

ists are essential for structuring content in a clear, hierarchical format. Amazium provides styling for:

Unordered Lists (<ul>) – Ideal for general items without a specific order.
Ordered Lists (<ol>) – Useful when sequence matters.
Definition Lists (<dl>) – Best for terms and their descriptions.

Unordered Lists

Unordered lists use bullet points (•) to organize items.

Use <ul> when order does not matter.
Nest lists inside <li> elements for hierarchical structure.

Nullam id dolor id nibh ultricies vehicula ut id elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet.
Donec sed odio dui. Curabitur blandit tempus por
- Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Donec sed odio dui.

<ul>
  <li>Nullam id dolor id...</li>
  <li>
    Donec sed odio dui....
    <ul>
      <li>...</li>
    </ul>
  </li>
</ul>

Ordered Lists

Ordered lists display items with numerical indicators (1, 2, 3...).

Use <ol> when sequence is important (e.g., steps in a process).
Nested <ol> elements will use different numbering styles (1, a, i, etc.).

Nullam id dolor id nibh ultricies vehicula ut id elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet.
Donec sed odio dui. Curabitur blandit tempus por
1. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Donec sed odio dui.

<ol>
  <li>Nullam id dolor id...</li>
  <li>
    Donec sed odio dui....
    <ol>
      <li>...</li>
    </ol>
  </li>
</ol>

Definition Lists

Definition lists pair terms (<dd>) with their descriptions (<dt>).

Best for glossaries, FAQs, or term descriptions.
The <dd> element represents the term, and <dt> holds its definition.

Title: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nullam Ligula
Another title: Sed fugit nobis, natus consequatur eos nemo animi, labore aliquam temporibus, magnam modi iste doloribus illum laboriosam qui odit cumque tenetur molestias.

<dl>
  <dd>Title</dd>
  <dt>Lorem ipsum dolor sit amet...</dt>
  <dd>Another title</dd>
  <dt>ed fugit nobis, natus consequatur...</dt>
</dl>

Inline Definition Lists

Inline definition lists are a compact variation, displayed in a single line.

Title: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nullam Ligula
Another title: Sed fugit nobis, natus consequatur eos nemo animi, labore aliquam temporibus, magnam modi iste doloribus illum laboriosam qui odit cumque tenetur molestias.

<dl class="dl-inline">
  <dd>Title</dd>
  <dt>Lorem ipsum dolor sit amet...</dt>
  <dd>Another title</dd>
  <dt>ed fugit nobis, natus consequatur...</dt>
</dl>