Sbarazzarsi dei punti elenco da <ul>

163

Ho il seguente elenco:

 <ul id="otis">
 <li>Benz</li>
 <li>Other Benz</li>
 <li>Other Other Benz</li>
 </ul>

Voglio sbarazzarmi dei proiettili, quindi ho provato:

 ul#otis {
 list-style-type: none;
 }

Non ha funzionato però. Qual è il modo corretto di rimuovere i proiettili dall'elenco visualizzato?

html html-lists

— Sam Khan
fonte

1

Il tuo attuale HTML / CSS funziona bene per me in FF (JSFiddle). Quale browser stai usando? Vedi list-style: noneinvece se funziona.

— Bojangles,

1

ho provato questo su tutti i browser e i sistemi operativi Mac e Windows. sto usando html5 doctype ...

— Sam Khan,

197

Supponendo che non ha funzionato, potresti voler combinare il idselettore basato su con al lifine di applicare il CSS agli lielementi:

#otis li {
    list-style-type: none;
}

Riferimento:

list-style-typepresso il Mozilla Developer Center .

— David dice di ripristinare Monica
fonte

Qual è la differenza nel fare ul#otise #otis?

— PeeHaa,

In realtà non ce n'è uno, io, ehm, non sono riuscito a vedere il idselettore che hai usato. Oops scusa!

— David dice di ripristinare Monica il

1

dove su quel link posso trovare che deve essere definito sul li?

— PeeHaa,

Le prime due frasi: "La list-style-typeproprietà CSS specifica l'aspetto di un elemento della lista. Dato che è l'unico che ha come impostazione predefinita display:list-item" (sebbene permetta che possa applicarsi a qualsiasi elemento con una displayproprietà). Sebbene lo definiscano, per il loro esempio, sotto l' olelemento. Personalmente, per impostazione predefinita, definisco sempre sia l'elenco ( ul/ ol) sia gli lielementi.

— David dice di ripristinare Monica il

27

Anch'io ho avuto lo stesso problema estremamente irritante poiché la sceneggiatura non ha notato il mio foglio di stile. Quindi ho scritto:

<ul style="list-style-type: none;">

Quello non ha funzionato. Quindi, inoltre , ho scritto:

<li style="list-style-type: none;">

Ecco! ha funzionato!

— John Olav
fonte

20

Per rimuovere i punti elenco da elenchi non ordinati, è possibile utilizzare:

list-style: none;

Puoi anche usare:

list-style-type: none;

O funziona, ma il primo è un modo più breve per ottenere lo stesso risultato.

— Philpot
fonte

18

Il seguente codice

#menu li{
  list-style-type: none;
}

<ul id="menu">
        <li>Root node 1</li>
        <li>Root node 2</li>
    </ul>

Espandi frammento

produrrà questo output:

l'uscita è

— Kishan
fonte

15

Prova invece questo, testato su Chrome / Safari

ul {
 list-style: none;
}

— Paul Kaplan
fonte

4

Mettere

<style type="text/css">
 ul#otis {
     list-style-type: none;
   }
</style>

immediatamente prima dell'elenco per provarlo. O

<ul style="list-style-type: none;">

— Cose
fonte

4

Per rimuovere il proiettile da ULte puoi semplicemente usare list-style: none;o list-style-type: none;Se ancora non funziona, suppongo che ci sia un problema di CSS prioritario . Può essere già definito a livello globale UL. Quindi il modo migliore per aggiungere una classe / ID a quel particolare UL e aggiungere lì il tuo CSS . Spero che funzioni.

— Rokan Nashp
fonte

4

Questo ha funzionato perfettamente HTML

<ul id="top-list">
        <li><a href="#">Home</a></li>
        <li><a href="#">Process</a></li>
        <li><a href="#">Work</a></li>
        <li><a href="#">Team</a></li>
        <li><a href="#">Contact</a></li>
      </ul>

CSS

#top-list{
  list-style-type: none;
  list-style: none;}

— pokumars
fonte

3

Ci deve essere qualcos'altro.

Perché:

   ul#otis {
     list-style-type: none;
   }

dovrebbe funzionare.

Forse c'è qualche regola CSS che la sovrascrive.

Usa il tuo ispettore DOM per scoprirlo.

— PeeHaa
fonte

3

Ho avuto lo stesso problema e il modo in cui ho finito per risolverlo è stato così:

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

Forse è un po 'estremo, ma quando l'ho fatto, ha funzionato per me.

Spero che questo abbia aiutato

— Braden Best
fonte

3

per foglio di stile in linea prova questo codice

<ul style="list-style-type: none;">
    <li>Try This</li>
    </ul>

— Luca
fonte

1

il tuo codice:

ul#otis {
    list-style-type: none;
}

il mio consiglio:

#otis {
    list-style-type: none;

}

in css devi solo usare il #idnon element#id. suggerimenti più utili sono forniti qui: w3schools

— Evan
fonte

0

Ho avuto un problema identico.

La soluzione era che il proiettile veniva aggiunto tramite un'immagine di sfondo , NON tramite un tipo di elenco. Un veloce "background: none" e Bob è tuo zio!

— Ruskin
fonte