CSS - estilo de lista

Descrição

A propriedade de estilo de lista é uma propriedade abreviada usada para definir a posição e o tipo de marcadores em uma lista; também pode ser usado para atribuir uma imagem como marcador.

Valores possíveis

<list-style-type> - Qualquer valor permitido para o tipo de estilo de lista de propriedades.
<list-style-position> - Qualquer valor permitido para a posição do estilo da lista de propriedades.
<list-style-image> - Qualquer valor permitido para a imagem de estilo de lista de propriedades.

Aplica-se a

Todos os elementos com uma exibição de item de lista.

Sintaxe DOM

object.style.listStyle = "decimal;"

Exemplo

Aqui está o exemplo -

<html>
   <head>
   </head>
   
   <body>
      <ul style = "list-style-type:circle;">
         <li>Maths</li>
         <li>Social Science</li>
         <li>Physics</li>
      </ul>
      
      <ul style = "list-style-type:square;">
         <li>Maths</li>
         <li>Social Science</li>
         <li>Physics</li>
      </ul>
      
      <ol style = "list-style-type:decimal;">
         <li>Maths</li>
         <li>Social Science</li>
         <li>Physics</li>
      </ol>
      
      <ol style = "list-style-type:lower-alpha;">
         <li>Maths</li>
         <li>Social Science</li>
         <li>Physics</li>
      </ol>
      
      <ol style = "list-style-type:lower-roman;">
         <li>Maths</li>
         <li>Social Science</li>
         <li>Physics</li>
      </ol>
   </body>
</html>

Isso produzirá o seguinte resultado -

↰ Previous page