Comment créer des puces HTML?

Comment créer des puces HTML?

Les puces HTML sont livrées avec des éléments de liste ordonnés ou non ordonnés. Le "

    "Est utilisé pour créer la liste non ordonnée et le"
      »La balise est utilisée pour créer la liste commandée. Avec lui, le «
    1. »La balise est utilisée pour créer chaque élément de la liste. Le but de l'utilisation d'une liste à puces est d'afficher plusieurs contenus dans le formulaire de liste pour rendre le contenu facile à comprendre pour l'utilisateur. S'il y a plus d'un élément de liste sur le site Web, pour créer une séparation visuelle, différentes puces stylisées peuvent être utilisées.

      Cet article montre comment créer des puces dans HTML:

      • Bullets de liste ordonnés
      • Bullets de liste non ordonnés

      Comment créer des puces de liste commandée dans HTML?

      Les listes commandées sont utilisées lorsque le développeur souhaite afficher la liste de contenu dans le formulaire commandé. Les balles d'article dans la liste ordonnée se présentent principalement sous la forme de numérique ou alphabétique. Suivez la démonstration ci-dessous pour obtenir des connaissances sur le style de la balle principalement utilisée pour les listes ordonnées en HTML:

      Exemple 1: Nombres comme point de puces

      Par défaut, la liste de commandes affiche les nombres sous forme de puces avec des éléments de liste à partir de un.


      Propulsé par Linuxhint



      1. Joseph

      2. Alex

      3. Elizbeth

      4. Jackson

      5. Forgeron
      6. Auston


      Après l'exécution du code ci-dessus, la page Web ressemble à ceci:

      La sortie affiche que les éléments de liste commandés sont affichés avec le style de balle par défaut.

      Exemple 2: lettres majuscules

      Pour afficher le «Caractères alphabétiques«Comme puces avec les éléments de liste d'une liste ordonnée. Le "taper«Attribut de«

        "Est utilisé et défini sur"b«Ce qui signifie des caractères alphabétiques en majuscules:


        Propulsé par Linuxhint



        1. Joseph

        2. Alex

        3. Elizbeth

        4. Jackson

        5. Forgeron


        Après l'exécution du code ci-dessus, la page Web ressemble à ceci:

        La sortie montre que les puces sont en caractères majuscules.

        Exemple 3: lettres minuscules

        Pour régler les minuscules comme une puce, le «taper«La valeur d'attribut est définie sur«un»:


        Propulsé par Linuxhint



        1. Joseph

        2. Alex

        3. Elizbeth

        4. Jackson

        5. Forgeron


        Après avoir affiché le code ci-dessus, la page Web ressemble à ceci:

        La sortie ci-dessus montre que les puces sont maintenant modifiées en caractères minuscules.

        Exemple 4: Nombres romains en majuscules

        Les numéros romains peuvent également être insérés comme une puce pour les éléments de liste ordonnés. Pour définir les numéros romains en majuscules, le «taper"La valeur d'attribut est définie sur le capital"je" comme indiqué ci-dessous:


        Propulsé par Linuxhint



        1. Joseph

        2. Alex

        3. Elizbeth

        4. Jackson

        5. Forgeron


        Après avoir exécuté l'extrait de code ci-dessus, la page Web ressemble à ceci:

        La sortie ci-dessus affiche que les numéros romains majuscules sont maintenant sélectionnés comme puces.

        Exemple 5: Nombres romains en minuscules

        De la même manière, affichez les numéros romains en minuscules, le «je"Est défini comme une valeur pour le"taper»Attribut comme indiqué ci-dessous:


        Propulsé par Linuxhint



        1. Joseph

        2. Alex

        3. Elizbeth

        4. Jackson

        5. Forgeron


        Après avoir exécuté le code ci-dessus:

        La sortie ci-dessus illustre que les numéros romains minuscules sont définis sous forme de bullets pour les éléments de liste.

        Comment créer des puces de liste non ordonnées dans HTML?

        La liste non ordonnée est utilisée pour afficher la liste des éléments qui ne sont pas en ordre. Cela signifie que le contenu de l'élément de liste peut être placé à n'importe quelle position de la liste. Il existe quatre styles de balles possibles pour une liste non ordonnée:

        Exemple 1: Bullet Disc Point

        Le "disque”Le style est le style par défaut de la liste non ordonnée. Bien que le "disque«Le style peut également être affecté aux éléments de la liste à l'aide du«taper»Attribut comme indiqué ci-dessous:


        Propulsé par Linuxhint



        • Joseph

        • Alex

        • Elizbeth

        • Jackson


        Après l'exécution de l'extrait de code ci-dessus, la page Web ressemble à ceci:

        La sortie illustre que les styles de balles sont définis sur le «disque" style.

        Exemple 2: Bullet Point Circle

        Le "taper«L'attribut de la liste non ordonnée est utilisé pour définir le style de balle comme«cercle”Via l'extrait de code ci-dessous:


        Propulsé par Linuxhint



        • Joseph

        • Alex

        • Elizbeth

        • Jackson


        Après l'exécution de l'extrait de code ci-dessus:

        La sortie confirme que le style de balle des éléments de liste est désormais défini sur «cercle".

        Exemple 3: Point de puce carré

        Pour définir la valeur du «taper" attribuer à "carré», Les utilisateurs peuvent créer des balles de conception carrée avec les éléments de liste de la liste non ordonnée:


        Propulsé par Linuxhint



        • Joseph

        • Alex

        • Elizbeth

        • Jackson


        Après compilation du code indiqué ci-dessus, la page Web ressemble à ceci:

        La sortie confirme que les listes de balles en forme carrée sont désormais attribuées à chaque élément de liste.

        Conclusion

        Le style de balle peut être conçu pour les listes commandées et non ordonnées à l'aide du «taper" attribut. Pour la liste ordonnée, le «taper«Valeurs de«1 ”,« A »,« A »,« I »et« I"Réglez la puce sur"Numerical "," Caractère en majuscule "," caractère minuscule "," numéro romain en majuscule "et" numéro romain minuscule" respectivement. Dans le cas d'une liste non ordonnée, «disque »,« carré »et« cercle”Affichez le disque, le carré et le cercle comme des puces, respectivement. Cet article a démontré avec succès comment créer / style des puces.