Necesito una lista desordenada sin viñetas

Resuelto praveenjayapal asked hace 15 años • 16 respuestas

He creado una lista desordenada. Siento que las viñetas de la lista desordenada son molestas, así que quiero eliminarlas.

¿Es posible tener una lista sin viñetas?

praveenjayapal avatar Jun 22 '09 20:06 praveenjayapal
Aceptado

Puede eliminar viñetas configurando el list-style-typeCSS nonepara el elemento principal (normalmente a <ul>), por ejemplo:

ul {
  list-style-type: none;
}

Es posible que también desee agregar padding: 0y margin: 0si también desea eliminar la sangría.

Consulte Listutorial para obtener un excelente tutorial sobre técnicas de formato de listas.

Paul Dixon avatar Jun 22 '2009 14:06 Paul Dixon

Si estás usando Bootstrap, tiene una clase "sin estilo":

Elimine el estilo de lista predeterminado y el relleno izquierdo en los elementos de la lista (solo hijos inmediatos).

Arranque 2:

<ul class="unstyled">
   <li>...</li>
</ul>

http://twitter.github.io/bootstrap/base-css.html#typography

Arranque 3, 4 y 5:

<ul class="list-unstyled">
   <li>...</li>
</ul>

Arranque 3: http://getbootstrap.com/css/#type-lists

Arranque 4: https://getbootstrap.com/docs/4.3/content/typography/#unstyled

Arranque 5: https://getbootstrap.com/docs/5.0/content/typography/#unstyled

Scott Stafford avatar Jul 11 '2013 15:07 Scott Stafford

Necesitas usarlist-style: none;

<ul style="list-style: none;">
    <li>...</li>
</ul>
karim79 avatar Jun 22 '2009 14:06 karim79

Pequeño refinamiento de las respuestas anteriores: para hacer que las líneas más largas sean más legibles si se extienden a líneas de pantalla adicionales:

ul, li {list-style-type: none;}

li {padding-left: 2em; text-indent: -2em;}
charliehoward avatar Dec 10 '2012 05:12 charliehoward