Lists
Lists are used for many things, such as menus, css drop down, etc. but in this page, I will only list the basic usage of lists. Each time, put the new item between the li element.
<ul>It shows:
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ul>
- Item 1
- Item 2
- Item 3
- Item 4
ul means Unordered List so it uses bullets.
<ol>
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
<li>Item four</li>
</ol>
- Item one
- Item two
- Item three
- Item four
As you probably guessed, ol means Ordered List, thus it uses number.
Customize!
You can easily customize your lists using CSS! For example, change the bullets for Unordered Lists, example of stylesheet:
ul { list-style: circle; }circle can be replaced by square and the default one is disc. You can also use images:
ul { list-style: url(bullet.gif); }As for Ordered Lists, if regular numbers aren't cool enough for you, you can use roman numbers or alphabet letters:
ol { list-style: lower-roman; }lower-roman can be replaced by upper-roman, lower-alpha, upper-alpha and the default is decimal.
- Using
- lower
- alpha
One Response to “Lists”
Leave a Comment
Works? Doesn't work? Other tips? Please leave a comment! :)
Hi, I saw your blog on ordered list and had a question for you. I am trying to put a large bylaws document online and am running into a problem with the ordered list. The bylaws use a numbering system that has decimals in it. So the first is 1.01 then 1.02 and so on. I know that you can set the li value to a whole number by