Maison  >  Article  >  interface Web  >  Comment supprimer le point devant li en CSS

Comment supprimer le point devant li en CSS

醉折花枝作酒筹
醉折花枝作酒筹original
2021-04-09 17:26:486362parcourir

En CSS, vous pouvez utiliser l'attribut list-style pour effacer les points devant li. Il vous suffit de définir le style "list-style:none" sur la balise li. L'attribut list-style est utilisé pour contrôler le marquage des éléments de la liste. Lorsque la valeur est nulle, la marque du projet devant li peut être effacée.

L'environnement d'exploitation de ce tutoriel : système Windows 7, version CSS3&&HTML5, ordinateur Dell G3.

Lorsque de nombreuses personnes utilisent des div pour créer des sites Web, elles utilisent toujours li, mais il y a toujours un petit point noir devant l'effet d'affichage. Cela donne mal à la tête à beaucoup de gens, mais le. la source est introuvable, sinon nous pouvons utiliser les méthodes suivantes pour l'effacer.

1. Écrivez du code en CSS. Trouvez le CSS pertinent et écrivez sous .li.ul et list-sytle:none; Bien sûr, certaines personnes écriront list-style-type:none comme ceci. Cette méthode d'écriture est la plus courante notamment dans certains CMS.

2. Trouvez la partie d'en-tête de la page concernée et écrivez le code suivant

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

3. Ajoutez un style de liste à li et ul.

<ul style="list-style-type:none>
    <li>
    <a herf="http://123.COM">我的博客</a>
    </li>
< /ul>

Bien sûr, c'est très gênant.

Le plus simple est le premier, qui est contrôlé via CSS. Cela aura bien sûr de bons effets.

Ces méthodes sont toutes définies par le paramètre list-style:none. Certaines utiliseront list-style-type. Jetons un coup d'œil à ses propriétés.

  • aucun : ne pas utiliser de puces

  • disque : cercle rempli, valeur par défaut cercle cercle creux

  • carré : carré plein

  • décimal : chiffres arabes

  • inférieur-romain : chiffres romains minuscules

  • majuscules romains : chiffres romains majuscules

  • alpha minuscules lettres anglaises

  • alpha majuscule : lettres anglaises majuscules

Celles-ci peuvent être utilisées pour n'en remplacer aucune ci-dessus, et il y aura une correspondance correspondante pour ce que vous voulez.

A), utilisez CSS pour formater le symbole de la liste :

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

B), si vous souhaitez changer le symbole de la liste en image, alors :

ul li{
list-style-type:none;
list-style-image: url(images/icon.gif);
}

C) , pour la gauche Pour l'alignement, vous pouvez utiliser le code suivant :

ul{
list-style-type:none;
margin:0px;
}

D). Si vous souhaitez ajouter une couleur de fond à la liste, vous pouvez utiliser le code suivant :

ul{
list-style-type: none;
margin:0px;
}
ul li{
background:#CCC;
}

Apprentissage recommandé : Tutoriel vidéo CSS

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn