HTML list tutorial example explained
#HTML #list #lists
#HTML #list #lists
Category
📚
LearningTranscript
00:00so welcome back guys guys
00:02today we are going to see
00:04what type of list we have in html
00:06and how we write
00:08and utilize list
00:10and what are the benefits of list
00:12so lets start
00:14intro
00:28welcome back guys
00:30guys we are available in both code screen and browser screen
00:32lets see where we use
00:34so here
00:36what is the list
00:38basically we have
00:403 types of list in html
00:42and where
00:44we use list
00:46this question
00:48is asked many times
00:50where we use list
00:52basically when you make
00:54navbar of any website
00:56most of the time
00:58we use list in navbar
01:00because you can
01:02use same item
01:04same tag
01:06from list
01:08so how we make list
01:10we have 3 types of list
01:12one is order list
01:14and another one is
01:16unordered list
01:18and last one is
01:20definition list
01:22so here we have 3 types of list
01:24lets see
01:26order list
01:28for order list
01:30we use
01:32ol tag
01:34in ol tag
01:36we have allies
01:38and what is ol
01:40ol basically
01:42denotes
01:44ordered format list
01:46intentionally
01:48ordered format list
01:50it shows
01:52allies
01:54li
01:56list item
01:58list
02:00lets say
02:02grocery
02:04you have
02:06bullet points
02:08first
02:10second third
02:12fourth
02:14same as
02:16your home
02:18nothing complicated
02:20li is a tag which is used for a list item
02:28and along with this we write item1
02:32so here in ordered format we have written 1
02:37and after that item1 is written
02:40along with this we copy out this and change it
02:45and here I use the multi cursor option of VS Code
02:51and here we change it
02:53here we write 2
02:55so see here in an ordered format
02:58it is showing the list items
03:01that first you have to take 2
03:03after 2 you have to take 1
03:05then after that you have to take item 2
03:07then after that you have to take item 3
03:10so this ordered list is used in this format
03:14along with this we have ul
03:18ul is used for unordered list
03:22which is basically a bullet point
03:25so to make a bullet point
03:27you use the tag of ul
03:29you use the tag of unordered list
03:32so here we did like this
03:34and in the same way li is used here
03:38and here I wrote list1
03:40and here you will see
03:42that we have this unordered list
03:44we don't know which item to take first
03:46then which one to take
03:48so that's why it is called unordered list
03:52and basically many times
03:54unordered list is used on higher standard
03:56on microservices level
03:58in industry most of the time
04:00unordered list is used
04:02but because this is a full course of html
04:04so it is a series
04:06so you will know
04:08how many types of list are there
04:10and how many types we use
04:12one we have unordered list
04:14and one we have ordered list
04:16so we use ordered list
04:18so that we have a brief view
04:20that we have this item first
04:22and then this
04:24and then I have unordered list
04:26which doesn't show in ordered format
04:30along with this we have definition list
04:32and most of the time
04:34most of the time
04:36we don't use definition list
04:38we use dl
04:40and dl
04:42is used like this
04:44and dt
04:46comes first
04:48that what is our definition
04:50then dd comes
04:52so that we can write
04:54definition description
04:56that see
04:58the list which we show
05:00along with indentation
05:02that we have
05:04that is definition list
05:06if we see here
05:08that we have used dd
05:10then it will come down
05:12along with this
05:14it has indent
05:16we don't know
05:18that we have this list
05:20most of the time
05:22when we use definition list
05:24then we
05:26basically
05:28if we want to make any paragraph
05:30then to give heading
05:32we use definition list
05:34and if we have multiple
05:36in a blog or
05:38in a website
05:40or multiple paragraph tag
05:42available then we
05:44write dd
05:46then in dd
05:48basically dt
05:50represents
05:52the heading of this paragraph
05:54so this
05:56dt tag
05:58represents heading of paragraph
06:00or list
06:02heading
06:04this ordered list and unordered list
06:06i have made
06:08in that you don't have any definition
06:10that item 1
06:12from which market
06:14or from which
06:16let's suppose you have gone to buy
06:18bun from a bakery
06:20so if i write
06:22bakery on this bun
06:24then you will know
06:26that i have bought this from bakery
06:28like this definition list
06:30defines
06:32this paragraph
06:34or list item
06:36from which
06:38concern it belongs
06:40so here in dd
06:42if i write lorem
06:44then that paragraph will show
06:46it's a random paragraph
06:48there is no need to read
06:50so today we saw
06:52how to utilize
06:54unordered list, ordered list and definition list
06:56so this was
06:58basic
07:00and as such
07:02there is no need to
07:04join deep
07:06unordered list, ordered list and
07:08definition list are very
07:10useful tags
07:12so do check it out
07:14see you in next video
07:16do like and subscribe
07:26subscribe
07:28subscribe