En alguns casos, estem obligats a eliminar les vinyetes de les llistes ordenades i no ordenades. L'eliminació de les vinyetes de la llista no és una tasca complexa amb CSS. Es pot fer fàcilment configurant el CSS estil de llista o tipus de llista d'estil propietat a cap .
El tipus de llista d'estil La propietat CSS s'utilitza per establir el marcador (com un disc, un caràcter o l'estil de comptador personalitzat) d'a llista element element. Aquesta propietat CSS ens ajuda a crear la llista sense vinyetes. Només es pot aplicar a aquells elements el valor de visualització dels quals està establert element de llista. El tipus de llista d'estil La propietat s'hereta, de manera que es pot aplicar a l'element pare (com ara o
) perquè s'apliqui a tots els elements de la llista.
Per defecte, els elements de la llista ordenada estan numerats amb números aràbics (1, 2, 3, etc.) i els elements d'una llista no ordenada es marquen amb vinyetes rodones (•). El tipus de llista d'estil La propietat CSS ens permet canviar el tipus de marcador de llista per defecte a qualsevol altre tipus, com ara quadrat, cercle, números romans, lletres llatines i molts més.
Si posem el seu valor a cap , eliminarà els marcadors/les bales. En lloc d'eliminar les vinyetes d'una llista, les podem substituir per les imatges. Fa que el lloc sigui visualment més atractiu. Es pot fer utilitzant el imatge-estil-lista propietat.
Entendrem com eliminar els punts amb un exemple.
Exemple
En aquest exemple, estem utilitzant llistes ordenades i no ordenades i apliquem l' tipus de llista d'estil propietat amb el valor cap per eliminar les vinyetes dels elements de la llista.
ol { list-style-type: none; font-weight: bold; font-size: 20px; } ul { list-style-type: none; font-weight: bold; font-size: 20px; } <h2>Ordered list</h2> <ol> <li>List Item 1</li> <li>List Item 2</li> <li>List Item 3</li> </ol> <h2>Unordered list</h2> <ul> <li>List Item 1</li> <li>List Item 2</li> <li>List Item 3</li> </ul> Prova-ho ara Sortida
