We’ve addressed unordered lists but haven’t really done much with the ordered ones. What’s the difference? Well, unordered lists use bullets and ordered list use numbers. They both use the <li> tag but start differently with the unordered being <ul> while the ordered is <ol>. Without using any styling for the ordered list you get that ugly set of numbers that label each list item. Using a little bit of styling produces much better results.
Check it out – this is standard list display:
- blah blah
- blah blah blahhhh
- blah blah blahhhhhh
Now, with some style use in our CSS we can come up with something like this:
-
blah blah
-
blah blahhh
-
blah blah blahhhhhhhhhh
Here’s the CSS:
|
|
" ]ol { font: italic 1em Georgia, Times, serif; color: #999999; } ol p { font: normal .8em Arial, Helvetica, sans-serif; color: #000000; } |
And the HTML:
|
|
" ] <ol> <li> This is line one</li> <li> Here is line two</li> <li> And last line</li> </ol> |
