Hello Friends,
Today we are going to look at Unordered and Ordered lists.
Now lists are pretty much an everyday part of life, we constantly putting together lists. You think of buying a bike and you have to have list of accessories and functions you required in that bike. Similarly you can take example of recipe, for that also first you require list of ingredients, etc.
If you look at virtually, every web page they will always have some sort of list and whether that's menu or just a bullet lists.
Now HTML provides two main ways to do lists, Unordered and Ordered lists.
As we looked at in the previous lessons it's just a simple tag that we need to create.
An Unordered list is created with the <ul> tag and an ordered list is created with the <ol> tag.
In HTML, the Unorderd list is kind of default thing people use when they are designing websites.
Ordered lists are used to a lesser extent.
It is common to both Unorderd and Ordered lists is the <li> element tag.The li element is actually the list item embedded inside either the <ul> tag or the <ol> tag.
1) Unorderd List :-
Remember every thing goes within the body element, so lets go ahead and create <ul> tag.
Let's imagine we are creating menu for our website and we want to sell cloths of kids, men's & women's, so kids, men's & women's comes inside a <li> element.
Let's go ahead and save this as an HTML document and there you see we have got our nice list displayed.
2) Ordered list :-
Today we are going to look at Unordered and Ordered lists.
Now lists are pretty much an everyday part of life, we constantly putting together lists. You think of buying a bike and you have to have list of accessories and functions you required in that bike. Similarly you can take example of recipe, for that also first you require list of ingredients, etc.
If you look at virtually, every web page they will always have some sort of list and whether that's menu or just a bullet lists.
Now HTML provides two main ways to do lists, Unordered and Ordered lists.
As we looked at in the previous lessons it's just a simple tag that we need to create.
An Unordered list is created with the <ul> tag and an ordered list is created with the <ol> tag.
In HTML, the Unorderd list is kind of default thing people use when they are designing websites.
Ordered lists are used to a lesser extent.
It is common to both Unorderd and Ordered lists is the <li> element tag.The li element is actually the list item embedded inside either the <ul> tag or the <ol> tag.
1) Unorderd List :-
Remember every thing goes within the body element, so lets go ahead and create <ul> tag.
Let's imagine we are creating menu for our website and we want to sell cloths of kids, men's & women's, so kids, men's & women's comes inside a <li> element.
 |
| Unordered list |
 |
| Web page |
2) Ordered list :-
It's very similar to the Unordered list, we just have to replace <ul> tag with the <ol> tag.
Now lets go ahead and save this as an HTML file again.
There you see the the difference, this is why it called a ordered list because we have numbers there. That's the only difference, <ul> tag creates Bullets while <ol> tag creates numbers.
Note:- By using CSS you will style each one of these tags and creates a lot of different effects.
 |
| Ordered tag |
Now lets go ahead and save this as an HTML file again.
 |
| Web page |
Note:- By using CSS you will style each one of these tags and creates a lot of different effects.
No comments:
Post a Comment