Necesito una lista desordenada sin viñetas
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?
Puede eliminar viñetas configurando el list-style-type
CSS none
para el elemento principal (normalmente a <ul>
), por ejemplo:
ul {
list-style-type: none;
}
Es posible que también desee agregar padding: 0
y margin: 0
si también desea eliminar la sangría.
Consulte Listutorial para obtener un excelente tutorial sobre técnicas de formato de listas.
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
Necesitas usarlist-style: none;
<ul style="list-style: none;">
<li>...</li>
</ul>
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;}