Atributo CSS list-style

Definição e uso

A propriedade abreviada list-style define todas as propriedades da lista em uma declaração.

Explicação

Esta propriedade é uma propriedade abreviada que abrange todas as outras propriedades de estilo da lista. Devido a ela ser aplicada a todos os elementos com display list-item, pode ser usada apenas em elementos li no HTML e XHTML normais, mas na prática pode ser aplicada a qualquer elemento e herdada pelo elemento list-item.

Pode configurar os seguintes atributos em ordem:

Pode omitir um dos valores, por exemplo, "list-style:circle inside;" também é permitido. As propriedades não configuradas usarão seus valores padrão.

Veja também:

Tutorial de CSS:Lista CSS

Manual de referência do HTML DOM:Propriedade listStyle

Exemplo

Defina a imagem como marcador do item da lista:

ul
  {
  list-style:square inside url('/i/arrow.gif');
  }

Experimente você mesmo

Sintaxe do CSS

list-style: list-style-type list-style-position list-style-image|initial|inherit;

Valor da propriedade

Valor Descrição
list-style-type Defina o tipo do marcador do item da lista. Veja:list-style-type valores possíveis.
list-style-position Defina onde o marcador do item da lista deve ser colocado. Veja:list-style-position valores possíveis.
list-style-image Use imagens para substituir o marcador da lista de itens. Veja:list-style-image valores possíveis.
inherit Especifica que o valor da propriedade list-style deve ser herdado do elemento pai.

Detalhes técnicos

Valor padrão: disc outside none
Herança: sim
Versão: CSS1
Sintaxe do JavaScript: object.style.listStyle="decimal inside"

Mais exemplos

Definir todas as propriedades da lista em uma declaração
Este exemplo demonstra como definir todas as propriedades da lista em uma propriedade abreviada.

Suporte do navegador

Os números na tabela indicam a primeira versão do navegador que suporta completamente essa propriedade.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 7.0