In alcuni casi, siamo tenuti a rimuovere i punti elenco degli elenchi non ordinati e ordinati. La rimozione dei punti elenco non è un compito complesso utilizzando i CSS. Può essere fatto facilmente impostando il CSS stile elenco O tipo di stile elenco proprietà a nessuno .
IL tipo di stile elenco La proprietà CSS viene utilizzata per impostare il marcatore (come un disco, un carattere o lo stile del contatore personalizzato) di a elenco elemento dell'articolo. Questa proprietà CSS ci aiuta a creare l'elenco senza punti elenco. Può essere applicato solo a quegli elementi il cui valore di visualizzazione è impostato su voce-elenco. IL tipo di stile elenco La proprietà è ereditata, quindi può essere applicata all'elemento genitore (come O
) per applicarlo a tutti gli elementi dell'elenco.
Per impostazione predefinita, gli elementi dell'elenco ordinato sono numerati con numeri arabi (1, 2, 3, ecc.) e gli elementi di un elenco non ordinato sono contrassegnati con punti rotondi (•). IL tipo di stile elenco La proprietà CSS ci consente di modificare il tipo di indicatore predefinito dell'elenco in qualsiasi altro tipo come quadrato, cerchio, numeri romani, lettere latine e molti altri.
Se impostiamo il suo valore su nessuno , rimuoverà i marcatori/proiettili. Invece di rimuovere i punti elenco in un elenco, possiamo sostituirli con le immagini. Rende il sito visivamente più attraente. Può essere fatto utilizzando il file immagine-stile-elenco proprietà.
Capiamo come rimuovere i punti elenco utilizzando un esempio.
Esempio
In questo esempio, stiamo utilizzando sia elenchi ordinati che non ordinati e applichiamo il metodo tipo di stile elenco proprietà con il valore nessuno per rimuovere i punti elenco degli elementi dell'elenco.
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> Provalo adesso Produzione
