CSS Lists

List In CSS

There are three different properties for styling list items give down below -

1. list-style-type
2. List-style-image
3. list-style-position

which should be declared in that order. 

The default values are  - 

1. disc
2. outside
3. none, respectively. 

Each property can be declared separately, or using the list-style shorthand property.

1. list-style-type defines the shape or type of bullet point used for each list-item. 

Some of the acceptable values for list-style-type - 

• disc
• circle
• square
• decimal
• lower-roman
• upper-roman
• none

Example - 

Output - 

2. The list-style-image 

This property determines whether the list-item icon is set with an image, and accepts a value of none or a URL that points to an image.

Example  -

3. The list-style-position 

This property defines where to position the list-item marker, and it accepts one of two values: "inside" or "outside".

Syntax - 

li { list-style-position: inside; }