HTML Lists Tutorial | HTML5 List Types: Ordered, Unordered & Description

In this HTML lists tutorial you will learn about HTML5 list types including ordered, unordered & description lists. Lists are used frequently in HTML web pages and knowing which type of list to use will help your designs.

🚀 This lesson is part of an HTML for Beginners tutorial series playlist:

HTML Lists Tutorial | HTML5 List Types: Ordered, Unordered & Description

(00:00) Intro
(00:05) Welcome
(00:25) 3 Types of HTML Lists
(00:40) Dev Environment Overview
(02:04) Ordered Lists
(04:32) Unordered Lists
(06:48) Description Lists
(08:58) Validate your HTML code

⚙ Web Dev Tools:

📚 References:

✅ Follow Me:

Was this tutorial about HTML list types helpful? If so, please share. Let me know your thoughts in the comments.

#html #html5 #lists

[junalddayao]

hi dave, I just wanna say thank u for this tutorial ive been watching ur videos since july 27 to learn the basics of html and my next is css. im incoming first year BSIT college so this was very helpful to me and also im planning to be a freelancer web developer to support my study. I also want you to give me advice in my journey and what is the best way i can do, thank you in advance!!!!

[gqcodes]

You're a fantastic teacher. Thank you so much!

[fairytail]

Thank you very much for teaching me the basics of html. Planning to watch all of your videos related to web development. Great job!!!

[ahmad-murery]

I think the description list element is very underrated,
I started using it recently when I have a name-value pair such as displaying a product details,

also, it might be worth mentioning that according to MDN we can wrap the dt/dd group in a div element which is useful for Microdata (I just recently heard about), Global attributes and styling,

Thanks Dave,

[IG-cu]

One thing that is kind of messing with my head is that <p> element inside of an <li> element. Despite being within the <li> element it's affecting the space outside of the <li> element. Just wondering how that works. Sorry if this sounds a bit dumb. I'm coming back to these HTML videos because unfortunately I lost my way in the CSS series and took too long of a break. So now I'm trying to get through each video slowly but surely to make sure I understand what's going on.

[aaronkagandev]

Thank you very much Dave! How do i know if i should be writing my text directly inside the <li> or have the <p> nested inside? Thanks again!

[v.pimonenko]

Thank you for such a great tutorials, it helps a lot on the way to learn and so easy to understand even for people with low level of English.

[Abdulafeez-dpcs]

Thank you dave but I am having a issue with my back to home it is showing some sort of folders

[alanstancliff]

Hey Dave,
I hope you see this and it does not disappear. I am finding that the prettier extension is not working in VS code. I suspect it may not be in a trusted workspace. How can I put it into a trusted workspace? I spent a couple of hours trying to figure this out and am at wits' end.

Please help me out with this!