When you learned about lists in HTML you saw just default unordered and ordered lists (numbered and bullet lists). CSS allows you to change the appearance of these. These are examples:
ul {
list-style-type:circle;
}
ol {
list-style-type:lower-roman;
list-style-position:inside;
}
You can also style the text to change the appearance of a list (using font-family, text-decoration etc.).
The possible values for the list-style-type attribute can be found on w3schools.
The list-style-position:inside increases the indentation.
Using images as bullets
Create or download suitably sized images for your bullets and then use this code:
ul {
list-style-image:url("/images/fred.png");
list-style-type:disc;
}
The list-style-type is used if the image is not found.
