Lists

list-style-type

list-style-type is used to change the default marker for a list item.

For unordered-list, possible value of list-style-type are:

  • none
  • disc
  • circle
  • square

For ordered-list, possible value of list-style-type are:

  • decimal
  • decimal-leading-zero
  • lower-roman
  • upper-roman
  • lower-alpha
  • upper-alpha
  • lower-latin
  • upper-latin
  • georgian
  • armenian
  • none
  • inherit

Syntax for using list-style-type:

ol
{
    list-style-type:lower-alpha;
}

ul
{
    list-style-type:square;
}

list-style-image

list-style-image is used to set specified image as list item marker for your list.

Syntax for using list-style-image:

ul
{
    list-style-image:url('myimg.gif');
}

list-style-position

list-style-position is used to set position of marker for the list item. By default the position of the marker is outside the content block of li element. You can place the maker inside li elements. Possible value of list-style-position are:

  • outside - places the marker outside li
  • inside - places the marker inside li
  • inherit - inherit the value of element's parent

Syntax for using list-style-image:

ul
{
    list-style-position:outside;
}

list-style

list-style property is a shorthand property to style all your lists in one line.

Syntax for using list-style-image:

ul
{
    list-style: type  image  position;
}
<< Links and Navigation Tables >>