Dans cet article, nous utilisons le CSS en ligne et interne pour expliquer les étiquettes de CSS. L'utilisateur doit avoir des connaissances sur les balises HTML et CSS. En venant vers notre sujet en discussion, nous parlerons des balles qui jouent un rôle important dans l'alignement et l'assemblage du contenu, soit du texte ou des images, etc., sur le site Web pour créer un aspect esthétique du site Web à l'utilisateur.
Listes CSS
Lorsque nous parlons d'afficher une partie de notre contenu sur le site Web d'une manière spécifique de démonstration verticale, nous rencontrons les listes HTML. Cette fonction est utilisée pour afficher le texte sous forme de balles. Les deux types de listes sont en HTML.
Les deux types sont stylés à travers les balles CSS. Chaque fois que nous créons les listes, il est formé en utilisant des balles ou des marqueurs. La liste ordonnée contient la numérotation des données. Tandis que la liste non ordonnée contient des disques, des cercles, des carrés ou toute autre forme en rendant la forme de balle personnalisable.
Parfois, nous n'avons pas besoin d'aucune balle pour être ajoutée à la liste. Nous voulons simplement que le texte apparaisse sur la page sans aucun symbole ni signe. Nous désirons juste une liste simple n'ayant pas de balles. Cela se fait en utilisant une propriété CSS qui est la propriété de style CSS.
Propriété de type list CSS
Ceci est la propriété de CSS qui traite du style des marqueurs des éléments de la liste. Cette propriété est essentielle lorsque nous devons appliquer une balle à la liste ou si nous voulons supprimer ou masquer la balle par défaut. Nous utilisons cette propriété avec les classes et les ID pour spécifier la liste sur laquelle nous devons appliquer le style des balles. La syntaxe de base utilisée pour la propriété CSS List est la suivante:
Type de style liste: disque;Ceci est écrit à l'intérieur de la balise de style à laquelle cet effet doit être appliqué. Il existe différents types de valeurs de propriété qui sont appliquées à la fois sur les listes commandées et non ordonnées. Peu d'entre eux sont mentionnés dans ce qui suit:
Disque, cercle, carré, décimal, inférieur-romain, haut-romain, inférieur la-la-la-latin, inférieur-alpha, aucun.Maintenant, nous utilisons l'une des balles pour afficher l'exemple de mise en œuvre de la liste avec une balle en forme de disque.
Nous utilisons un code pour afficher simplement la liste et les balles utilisées pour définir une liste par défaut. Il n'est pas nécessaire de toujours décrire le type de balles pour la liste. Par défaut, un type spécifique de balle est sélectionné dans HTML. Mais ici, nous utilisons la balle en forme de disque à l'intérieur du code pour expliquer la déclaration de la liste. Tout d'abord, considérez la section du HTML. Après avoir utilisé une rubrique simple, nous utilisons une liste non ordonnée. Un style en ligne est utilisé ici.
Cela montre le type de balle à appliquer à la liste non ordonnée. À l'intérieur de
Code HTML et CSS
Enregistrez ce code, puis nous exécutons ce fichier html de l'éditeur de texte dans le navigateur.
Sortir:
Vous verrez que tous les éléments sont écrits dans la liste. Pour la liste ordonnée, vous pouvez utiliser la décimale, l'alpha inférieur, le bas romain, etc. En utilisant la même propriété de style listique.
Masquer les balles
En utilisant la fonctionnalité de type de style CSS List, nous pouvons également masquer les balles. À cette fin, nous ne spécifierons pas le nom de la balle, mais nous utiliserons «aucun» comme valeur pour la propriété. La syntaxe de style de base pour la liste pour masquer les balles est la suivante:
Dans cette implémentation, nous utilisons une liste non ordonnée pour afficher les deux listes avec des balles et une sans balles. Alors, commencez par la partie tête du code HTML. Ajouter un style à la tête. Le style suivant est pour la liste non ordonnée avec un ID supprimé. À l'intérieur de l'ID, nous utilisons la propriété de type de style liste sans valeur.
Ul # supprimerLe rembourrage est la distance entre les lignes de la liste. Cette fonctionnalité que nous avons ajoutée cache les balles de la liste. De même, pour les deux listes, nous utilisons les alignements pour la gauche et le côté droit de la page.
Code HTML CSS:
Après la partie de la tête à l'intérieur du corps, nous utilisons d'abord une rubrique. Un div est créé et aligné à gauche selon CSS. Ensuite, une simple liste non ordonnée est déclarée qui a des balles avec elle parce que nous n'avons pas utilisé l'ID de suppression avec cette liste. Tous les noms de sujets sont écrits dans chaque liste. Ensuite, nous fermons la liste non ordonnée et le conteneur div.
Ensuite, est à nouveau la classe div qui est placée à côté du div précédent. Nous utilisons un identifiant avec la liste. En raison de cet identifiant, le style «aucun» est appliqué et les balles sont cachées.
Tous les éléments de la liste sont déclarés dans la liste. Fermez la liste, div et le corps HTML.
Code corporel HTML:
Exécutez le fichier HTML sur le navigateur. Vous verrez qu'une page Web est formée. Un côté de la liste a des balles et l'autre côté n'a pas de balles. De cette façon, ce type de style CSS list nous aide à coiffer les balles ou à les supprimer de la liste.
Sortir:
Conclusion
Dans cet article, nous avons cherché à éclairer certaines propriétés de base mais importantes dans CSS et HTML. Au début, nous avons introduit des connaissances de base de CSS et HTML en mettant en évidence les types de CSS. Parmi les trois types, nous nous sommes concentrés sur le style interne avec la propriété de CSS en discussion. Ensuite, nous avons expliqué une partie importante de la page Web HTML qui est utilisée pour créer et aligner le contenu de la page dans une ligne verticale formant une liste. Les deux types de listes sont également introduits avec différentes formes et types de balles. Ensuite, la propriété de type de style CSS List est expliquée qui est un ingrédient essentiel dans le style ou la suppression de la disposition des balles.
Dans la mise en œuvre de la partie du code, nous avons d'abord implémenté un exemple pour élaborer le fonctionnement de cette propriété de style avec les balles de la liste non ordonnée. Le deuxième exemple explique l'utilisation combinée de la propriété de style pour ajouter ou supprimer les balles de la liste.