OrderedList

Source code
Table of Contents

Usage

Default

  1. Ordered list item
  2. Ordered list item
  3. Ordered list item
<script>
  import { OrderedList, ListItem } from "carbon-components-svelte";
</script>

<OrderedList>
  <ListItem>Ordered list item</ListItem>
  <ListItem>Ordered list item</ListItem>
  <ListItem>Ordered list item</ListItem>
</OrderedList>
  1. Ordered list item
  2. Ordered list item
  3. Ordered list item
<script>
  import { OrderedList, ListItem, Link } from "carbon-components-svelte";
</script>

<OrderedList>
  <ListItem>
    <Link href="#">Ordered list item</Link>
  </ListItem>
  <ListItem>
    <Link href="#">Ordered list item</Link>
  </ListItem>
  <ListItem>
    <Link href="#">Ordered list item</Link>
  </ListItem>
</OrderedList>

Nested

  1. Ordered list level 1
    1. Ordered list level 2
    2. Ordered list level 3
      1. Ordered list level 3
      2. Ordered list level 3
  2. Ordered list level 1
  3. Ordered list level 1
<script>
  import { OrderedList, ListItem } from "carbon-components-svelte";
</script>

<OrderedList>
  <ListItem>
    Ordered list level 1
    <OrderedList nested>
      <ListItem>Ordered list level 2</ListItem>
      <ListItem>
        Ordered list level 3
        <OrderedList nested>
          <ListItem>Ordered list level 3</ListItem>
          <ListItem>Ordered list level 3</ListItem>
        </OrderedList>
      </ListItem>
    </OrderedList>
  </ListItem>
  <ListItem>Ordered list level 1</ListItem>
  <ListItem>Ordered list level 1</ListItem>
</OrderedList>
Table of Contents