CSS List Style

The list-style property in CSS is a shorthand property used to set the style of markers for list items (<li> elements) within ordered (<ol>) and unordered (<ul>) lists.


Properties of List Style

  • list-style-type

    • Specifies the type of marker used for list items.

    • Values include : disc, circle, square, decimal, lower-alpha, upper-roman, none etc.


  • list-style-image

    • Sets an image as the marker for list items.

    • The image is used as a bullet point or numbering style for the list.


  • list-style-position

    • Determines whether the marker should be inside or outside the content flow.

    • Values : inside or outside.

Example

/* Setting list style for unordered lists */
ul {
  /* Square marker, outside the content flow, with a custom image */
  list-style: square outside url('bullet.png');
}
Share