Style listStyle Property

Style Object Reference Style Object

Example

Change the style of a list:

document.getElementById("myList").style.listStyle="decimal inside";

Try it yourself »


Definition and Usage

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

Internet Explorer Firefox Opera Google Chrome Safari

The listStyle property is supported in all major browsers.


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


Style Object Reference Style Object

Color Picker

colorpicker