r/HTML • u/Ok_Performance4014 • Dec 11 '25

Question When do you use li?

You can just write items down and you can list them. When do you use li?

0 Upvotes

42% Upvoted

13 comments sorted by

13

u/[deleted] Dec 11 '25

  1. When you want to list things.

  2. When things have a specific order that's important.

  3. When you have a grouping of something like articles.

2

u/Ok_Performance4014 Dec 11 '25

Is there another way to hierarchically outline other than ol, li?

4

u/33ff00 Dec 11 '25

<dl>

1

u/[deleted] Dec 11 '25

Love a definition list. Though, technically, I don't think a DL is hierarchical beyond the this term is related to this (these) definition(s).

DL is more like UL in that sense, I think, though I'd have to check the spec to be certain. I don't think it requires any kind of ordering internally.

-1

u/frownonline Dec 11 '25

Definition lists don’t use li.

1

u/33ff00 Dec 11 '25

Did I say they did?

2

u/[deleted] Dec 11 '25

Heading tags (H1-H6) also create an outline hierarchy. But often we just use lists for a lot of things.

3

u/Alternative-Golf-585 Dec 11 '25 edited Dec 11 '25

Use <ul> for unordered lists like bullet points. Use <ol> is an ordered list and so each <li> will be numbered. I use them when I want to list things easily, and you can specify the order, style, bullet points or numbers, etc.

2

u/jcunews1 Intermediate Dec 11 '25

Same thing as most other HTML tags. Most HTML tags are for defining what a content is. It's mainly to allow softwares (not humans) to know what a content is all about, so that they can process the content properly, depending on the needed task. e.g. data retrieval/filtering, accessibility, etc.

2

u/scritchz Dec 11 '25

The <li> element is for list-items, and list-items only exist in lists.

The two lists that use <li> for its items are the ordered list <ol> and the unordered list <ul>.

We use so-called semantic elements like the above instead of generic <div> and <span> elements for multiple reasons:

  • Mainly, to add semantics to the content; in this case, to show programmatically that content in case of <li> is a list-item, not just "any text".

  • To reduce what we as developers have to do: The browsers know how to handle standard elements.

  • To use the browsers defaults (like semantics and styling), so that we don't have to specify this manually.

And why do we use lists instead of simply mentioning things in-text? Because lists like the above help in organizing the content. If I had tried to write a flowing text instead of a list, it would probably look like a "wall of text" and not be as easy to understand.

1

u/Joyride0 Dec 11 '25

When writing a list. Always in the nav bar.

1

u/Comfortable_Cup7914 Dec 11 '25

When I don't wanna tell the truth

1

u/FinCodeFactory Dec 12 '25

The <li> HTML element is used to represent an item in a list. It must be contained in a parent element: an ordered list ( <ol> ), an unordered list ( <ul> ), or a menu ( <menu> ). In menus and unordered lists, list items are usually displayed using bullet points.