Style listStyle Property

Example

Change the style of a list:

document.getElementById("myList").style.listStyle = "decimal inside";
Try it Yourself »

Description

The listStyle property sets or returns up to three separate list properties, in a shorthand form.

With this property, you can set/return one or more of the following (in any order):

  • list-style-type
  • list-style-position
  • list-style-image

Browser Support

Property
listStyle Yes Yes Yes Yes Yes

Syntax

Return the listStyle property:

object.style.listStyle

Set the listStyle property:

object.style.listStyle = "type position image|initial|inherit"

Property Values

Parameter Description
type Defines the list-item marker type
position Positions the list-item marker
image Defines an image to be used as the list-item marker
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit


Technical Details

Default Value: disc outside none
Return Value: A String, representing the style of a list
CSS Version CSS1

More Examples

Example

Change the type and position of a list to "square inside":

document.getElementById("myList").style.listStyle = "square inside";
Try it Yourself »

Example

Return the list style:

document.getElementById("myList").style.listStyle;
Try it Yourself »

Related Pages

CSS tutorial: CSS List

CSS reference: list-style property


Copyright 1999-2023 by Refsnes Data. All Rights Reserved.