Cascading Style Sheets: CSS and Lists

If you can't see this email, click here

Cascading Style Sheets CSS and Lists From Jennifer Kyrnin, your Guide to Web Design / HTML Learn how to modify the display of bulleted and numbered lists (ordered lists) using CSS. Style the Type of List In CSS there are two types of lists: numbered and bulleted (as opposed to HTML, which has the definition list as well). But there are different types of bullets and numbers you can define with CSS using the list-style-type property: list-style-type: lower-roman; Use An Image as the Bullet Sometimes, it's nice to have a custom bullet to use instead of the boring circle, square, or disc supplied as the default bullets. With the list-style-image property you can indicate a bullet image to use instead: list-style-image: url(image.gif); Where Should the Bullet Be Positioned Even the placement of the bullet and where the text will flow around it can be defined with CSS using the list-style-position property: list-style-position: inside; The list-style Shorthand Property But if you want to define all aspects of your lists in one place you won't go wrong using the list-style shorthand property: list-style: alpha inside url(image.gif); This email is written by: Jennifer Kyrnin Web Design / HTML Guide Email Me | My Blog | My Forum   Missing a lesson? Click here. About U. is our collection of free online courses designed to help you learn a new skill, solve a problem, get something done, or just learn more about your world. Sign up now, and we will email you lessons on a daily or weekly basis. You are receiving this email because you subscribed to the About.com 'Cascading Style Sheets' email. If you wish to unsubscribe, please click here. About respects your privacy: Our Privacy Policy Contact Information: 249 West 17th Street New York, NY, 10011 © 2010 About.com   Advertisement