In This Tutorial, I Show You How To Make A List For Your Web Page
Maybe you’ve heard that people don’t read web pages, they scan them. Because of this, lists are very practical . You see them all over the web. Sometimes you may not even realize that the text you are looking at is a list.
With HTML, there are three kinds of lists. I’m tackling unordered and ordered lists here because they’re so similar. (The third kind is a definition list used mostly for glossaries).
An unordered list is a list where the order of the items doe not matter. Like this:
The HTML for this list uses two tags, ul and li. The ul stands for “unordered” and the li means “list item.” It could not be more straightforward.
To start the list , I use the
<ul> tag and, as you’ll see, the entire list ends with
</ul>. I use
</li> to enclose each list item (such as New York).
Here’s how that simple, unordered list looks in your browser:
Copy and paste the above list code in the box below or feel free to write your own code. Then click the "GIVE IT A TRY" box and check it out.
Test Your Code In This Box – The Code Tester
Here’s What You Did
Oh yeah. I almost forgot.
Suppose I wanted to list the first five U.S. Presidents. Here’s the HTML for an ordered list.
Looks the same as an unordered list, but this time I used <ol> – ordered list – instead of <ul> as I did in the previous example.
In this example, it’s the
<ol> tag which creates the numbers 1 – 5. It saves me from having to type in the numbers, plus it’s the right way to do a list whose items have an order that is relevant.
Get Happy And Start Learning HTML Right Now
Do The First Two Lessons For Free!!
All Of My Free Web Design Tutorials