Índice

Los símbolos de las listas

Esta propiedad permite determinar la apariencia del marcador o el estilo de numeración de la lista.

list-style-type:

disc;: disco completo.

circle;: círculo vacío.

square;: cuadrado.

o bien

decimal;: es decir, 1, 2, 3, etc.

decimal-leading-zero;: es decir, 01, 02, 03, etc.

upper-roman;: es decir, I, II, III, etc.

lower-roman;: es decir, i, ii, iii, etc.

upper-alpha;: es decir, A, B, C, etc.

lower-alpha;: es decir, a, b, c, etc.

Comentarios

Los elementos disc, circle, square son idénticos a los de la etiqueta <ul> en HTML5. Con estos, no obstante, la forma la determina por defecto el navegador.

Ocurre del mismo modo con las numeraciones en la etiqueta <ol>, aunque esta es únicamente decimal.

Ejemplo

<!DOCTYPE html> 
<html lang="es"> 
<head> 
   <title>Html5</title> 
   <meta charset="UTF-8">  
   <style type="text/css"> 
   .style1 { list-style-type:disc;}   
   .style2 { list-style-type:circle;}   
   .style3 { list-style-type:square;}   
   .style4 { list-style-type:decimal;}   
   .style5 { list-style-type: decimal-leading-zero;}  
   .style6 { list-style-type:upper-roman;}   
   .style7 { list-style-type:lower-roman;}   
   .style8 { list-style-type:upper-alpha;}   
   .style9 { list-style-type:lower-alpha;}   
   </style> 
</head> 
<body> 
<ul> 
   <li ...