list-styleDefine all attributes of a list element in one decleration. A useful technique is to define a style-type in addition to a list-image. If an image is not able to be loaded, then the style-type will be used as a backup. Value | Description | circle | Makes the bullet for each list item a circle. | square | Makes the bullet for each list item a square. | disc | Makes the bullet for each list item a disc. This is the default unordered list setting. | upper-alpha | Changes the list style numbering to uppercase alphabetic. | lower-alpha | Changes the list style numbering to lowercase alphabetic. | upper-roman | Changes the list style numbering to uppercase roman numerals. | lower-roman | Changes the list style numbering to lowercase roman numerals. | decimal | This is the default numbering for an ordered list. List items are numbering in numerical order. | inside | The bullets or numbers for the list will appear closer to the list items. | outside | The bullets or numbers for the list will appear apart from the list items. This is the default setting. | url | relative - specifies the location with respect to the local directory
exact - specifies the location with the full url | none | Tells the browser to not use any kind of "styling" for this attribute. |
Code:ul { list-style: circle inside url("http://www.example.com/noPic.gif");} Display:
- This list's image did
- NOT load correctly
- But because we chose to include
- A CSS list type, we avoided a bland list!
|