Lists
Lists take a variety of forms and are used to present a series of related content.
They can be used to display:
- a list of links
- a list of items
- or a list of metrics
Ordered Lists
Ordered lists are used to present a series of related content in a numbered list:
- A list item
- Another list item
- A third list item
- A fourth list item
There's often a lot of paragraphs, images, and other content between list items.
Lorem ipsum dolor sit amet, conse ctetur adipiscing elit. Nulla nec odio. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Sed adipiscing ornare risus. Morbi est est, blandit sit amet, sagittis vel, euismod vel, velit. Pellentesque egestas sem. Suspendisse commodo ullamcorper magna.
- elementum vulputate, nunc. Sed adipiscing ornare risus
- Ullamco sunt Lorem eiusmod dolore sit ea proident.
- Item 3
- Sub-item A
- Aliquip esse ut consequat cupidatat qui ea proident.
- Ullamco sunt Lorem eiusmod dolore sit ea proident.
- Sub-sub-item i
- Aliquip esse ut consequat cupidatat qui ea proident.
- Ullamco sunt Lorem eiusmod dolore sit ea proident.
- Ullamco sunt Lorem eiusmod dolore sit ea proident.
- elementum vulputate, nunc. Sed adipiscing ornare risus
Unordered Lists
Lorem ipsum dolor sit amet, conse ctetur adipiscing elit. Nulla nec odio. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc. Sed adipiscing ornare risus. Morbi est est, blandit sit amet, sagittis vel, euismod vel, velit. Pellentesque egestas sem. Suspendisse commodo ullamcorper magna.
- Lists start with an item
- And continue on
- And on
- Sometimes list items are really long which means that the text inside them is likely to wrap across multiple lines. This is fine, but it's important to make sure that the list items are still readable.
- Even between other list items
Then more text
- A list item
- A nested list item
- Another list item
- A nested list item
- A nested nested list item
- Let's go deeper
- I'm going to stop now
- Let's go deeper
- A nested nested list item
- A nested list item
- A third list item
Combinations
- 1st level unordered list
(ul)
- 2nd level ordered list
(ul ol)
- 3rd level unordered list
(ul ol ul)
- 3rd level unordered list
- 2nd level ordered list
(ul ol)
- 3rd level ordered list
(ul ol ol)
- 3rd level ordered list
- 2nd level ordered list
- 1st level unordered list
(ul)
- 2nd level unordered list
(ul ul)
- 3rd level unordered list
(ul ul ul)
- 3rd level unordered list
- 2nd level unordered list
(ul ul)
- 3rd level ordered list
(ul ul ol)
- 3rd level ordered list
- 2nd level unordered list
- 1st level ordered list
(ol)
- 2nd level ordered list
(ol ol)
- 3rd level unordered list
(ol ol ul)
- 3rd level unordered list
- 2nd level ordered list
(ol ol)
- 3rd level ordered list
(ol ol ol)
- 3rd level ordered list
- 2nd level ordered list
- 1st level ordered list
(ol)
- 2nd level unordered list
(ol ul)
- 3rd level unordered list
(ol ul ul)
- 3rd level unordered list
- 2nd level unordered list
(ol ul)
- 3rd level ordered list
(ol ul ol)
- 3rd level ordered list
- 2nd level unordered list