Question Besoin d'une liste non ordonnée sans puces


J'ai créé une liste non ordonnée. Je sens que les balles dans la liste non ordonnée sont gênantes, donc je veux les enlever.

Est-il possible d'avoir une liste sans puces?


2039
2018-06-22 13:57


origine


Réponses:


Vous pouvez supprimer des puces en définissant le list-style-type à none sur le CSS pour l'élément parent (généralement un <ul>), par exemple:

ul {
  list-style-type: none;
}

Vous pourriez également vouloir ajouter padding: 0 et margin: 0 à cela, si vous voulez également supprimer l'indentation.

Voir Listutorial pour une bonne présentation des techniques de formatage de liste.


3031
2018-06-22 14:00



Si vous utilisez Bootstrap, il a une classe "non style":

Supprimez le style de liste par défaut et le remplissage gauche sur les éléments de la liste (enfants immédiats uniquement).

Bootstrap 2:

<ul class="unstyled">
   <li>...</li>
</ul>

http://twitter.github.io/bootstrap/base-css.html#typography

Bootstrap 3 et 4:

<ul class="list-unstyled">
   <li>...</li>
</ul>

http://getbootstrap.com/css/#type-lists


466
2017-07-11 15:05



Vous devez utiliser list-style: none;

<ul style="list-style: none;">
    <li> ...</li>
</ul>

183
2018-06-22 14:00



en css, style,

 list-style-type: none;

49
2018-06-22 14:00



Vous devrez ajouter un style à la <ul> élément comme le suivant:

<ul style="list-style: none; ">
    <li>Item</li>
    ...
    <li>Item</li>
</ul>

Cela va enlever les balles. Vous pouvez également ajouter le CSS dans une feuille de style comme les exemples ci-dessus.


43
2018-06-22 14:02



en css ...

ul {
   list-style:none;
}

41
2018-06-22 14:00



Petit raffinement à ce qui précède: Pour rendre les lignes plus longues plus lisibles si elles débordent sur des lignes d'écran supplémentaires:

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

li {padding-left: 2em; text-indent: -2em;}

34
2017-12-10 05:55



Utilisez le CSS suivant:

ul {
  list-style-type: none
}

34
2018-06-22 14:00



Originaire de:

ul { list-style-type: none; }

Bootstrap:

<ul class="list-unstyled list-group">
    <li class="list-group-item">...</li>
</ul>

Remarque: Si vous utilisez des groupes de listes, il n'est pas nécessaire d'utiliser list-unstyled.


17
2018-05-14 21:23



J'ai utilisé le style de liste sur le ul et le li pour enlever les balles. Je voulais remplacer les balles par un personnage personnalisé, en l'occurrence un «tiret», qui donne un bel effet. Donc, en utilisant ce balisage:

<ul class="dashed-list">
  <li>text</li>
  <li>text</li>
</ul>

avec ce css:

ul.dashed-list
{
    list-style: none outside none;
}

ul.dashed-list li:before {
    content: "\2014";
    float: left;
    margin: 0 0 0 -27px;
    padding: 0;
}

ul.dashed-list li {
    list-style-type: none;
}

donne un effet joliment dentelé qui fonctionne lorsque le texte s'enroule


13
2017-09-17 04:52