I nogle tilfælde er vi forpligtet til at fjerne punkterne fra uordnede og ordnede lister. Fjernelsen af listepunkterne er ikke en kompleks opgave ved brug af CSS. Det kan nemt gøres ved at indstille CSS liste-stil eller liste-stil-type ejendom til ingen .
Det liste-stil-type CSS-egenskaben bruges til at indstille markøren (som en disk, et tegn eller den brugerdefinerede tællerstil) for en liste vareelement. Denne CSS-egenskab hjælper os med at oprette listen uden punkttegn. Den kan kun anvendes på de elementer, hvis visningsværdi er indstillet til liste-element. Det liste-stil-type egenskaben er nedarvet, så den kan anvendes på det overordnede element (f.eks eller
) for at få det til at gælde for alle listeelementer.
Som standard er de ordnede listepunkter nummereret med arabertal (1, 2, 3 osv.), og punkterne i en uordnet liste er markeret med runde punkttegn (•). Det liste-stil-type CSS-egenskaben giver os mulighed for at ændre standardlistetypen af markør til enhver anden type såsom firkant, cirkel, romertal, latinske bogstaver og mange flere.
Hvis vi sætter dens værdi til ingen , vil det fjerne markørerne/kuglerne. I stedet for at fjerne punkterne på en liste, kan vi erstatte dem med billederne. Det gør siden visuelt mere attraktiv. Det kan gøres ved at bruge liste-stil-billede ejendom.
Lad os forstå, hvordan man fjerner punkttegn ved at bruge et eksempel.
Eksempel
I dette eksempel bruger vi både ordnede og uordnede lister og anvender liste-stil-type ejendom med værdien ingen for at fjerne punkterne fra listepunkterne.
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> Test det nu Produktion
