turretcss

List


Example

Ordered List

  1. Vehicula Dapibus Tellus Fermentum
  2. Vehicula Dapibus Tellus Fermentum
  3. Vehicula Dapibus Tellus Fermentum
    1. Vehicula Dapibus Tellus Fermentum
    2. Vehicula Dapibus Tellus Fermentum

HTML

<ol>
  <li>...</li>
  <li>
    <ol>
      <li>...</li>
    </ol>
  </li>
</ol>

Unordered List

  • Vehicula Dapibus Tellus Fermentum
  • Vehicula Dapibus Tellus Fermentum
  • Vehicula Dapibus Tellus Fermentum
    • Vehicula Dapibus Tellus Fermentum
    • Vehicula Dapibus Tellus Fermentum

HTML

<ul>
  <li>...</li>
  <li>
    <ul>
      <li>...</li>
    </ul>
  </li>
</ul>

CSS

--list-margin: 1em 0;
--list-padding: 0;
--list-font-family: var(--paragraph-font-family);
--list-font-weight: var(--paragraph-font-weight);
--list-font-size: var(--paragraph-font-size);
--list-font-style: var(--paragraph-font-style);
--list-color: var(--paragraph-color);
--list-line-height: var(--paragraph-line-height);
--list-text-transform: var(--paragraph-text-transform);
--list-letter-spacing: var(--paragraph-letter-spacing);

--list-item-margin: 0.5em 0 0.5em 1.5em;
--list-item-padding: 0 0 0 0.5em;

--child-list-margin: 0.5em 0 0.5em 0;
--child-list-padding: 0;
--child-list-item-margin: var(--list-item-margin);
--child-list-item-padding: var(--list-item-padding);

--unordered-list-icon: disc;
--unordered-child-list-icon: disc;