Back

List Item

What is a list item <li> ?

The html language offers the possibility to create lists <ul>, where each enumeration is defined by the <li> tag. Each list element <li> nests in the associated list <ul>.

Why is it important to respect the list imbrication ? 

Depending on the nature of the list you create, you can adapt the content :

  • Unordered lists will be marked (by default) with bullets. There is therefore no order of importance in the hierarchy of the information in your list. The different elements of your list should appear in a block element <ul>, which is the element defining an unordered list block
     
  • The ordered (or numbered) lists are used to give a hierarchy to the different sequences of your list. This type of list must be integrated in a block element <ol>, which will allow to number each beginning of line of your list

If you do not embed your list item in a <ul> or <ol> block item, your list will not be interpreted correctly by your browser and will not be supported by assistive technologies.

How do I build a list ?

Your list should contain the following information :

  • an element of block <ol> or <ul>
  • a list sequence starting with <li>

For example :

<h1>Example of an ordered list of fruits</h1>
<ol>
    <Banana
    <orange/li>Orange/li>
    <pineapple>/pineapple>/li>
</ol>
This will result in :

Example of an ordered list of fruits

Banana
Orange
Pineapple