Não é bem um fundo, mas você também pode usar imagens para itens de lista para a sua página da web HTML5 e CSS3. Às vezes, você pode querer algum tipo de bala especial para as suas listas.

Nesta página, diversas variedades de pimentas foram listados. Para este tipo de lista, uma bala de pimenta feito sob encomenda é apenas a coisa. Claro, CSS é a resposta:

Meus Pimentas favoritos
Verde
habenero
Arrivivi Gusano

o list-style-image atributo permite que você anexar uma imagem a um item da lista. Para criar marcas personalizadas:

1. Comece uma imagem personalizada com.

   imagens de bala deve ser pequeno, assim você pode ter que fazer alguma coisa pouca. A imagem será cortada para uma dimensão apropriada, mas ele vai ter toda a altura da imagem original, assim torná-lo pequeno.

2. Especifique o list-style-image com um url atributo.

   Você pode definir a imagem como list-style-image, e todas as balas será substituído com essa imagem.

3. Teste a lista no seu browser.

   Certifique-se de que tudo está funcionando corretamente. Verifique se o navegador pode encontrar a imagem, que o tamanho é certo, e que tudo parece que você espera.

Se você não quiser usar uma imagem, CSS tem uma série de outros estilos que você pode aplicar para os itens da lista. Use o list-style-type governar para definir a sua lista para um dos muitos estilos. Olhe para documentação CSS oficial para uma lista completa, mas os tipos de estilo mais utilizados são disco, círculo, quadrado, decimal, upper-roman, lower-roman, superior latin, e inferior Latina.

Note que você pode aplicar um estilo numérico para um item da lista em uma lista ordenada ou desordenada, então a distinção entre esses tipos de lista é menos importante do que costumava ser.