Comment puis-je styliser des éléments uniques et étranges?

Comment puis-je styliser des éléments uniques et étranges?

Dans CSS, il existe différentes propriétés utilisées où certaines propriétés sont universelles, et certaines sont utilisées sur divers sélecteurs. Cependant, si les utilisateurs veulent styliser les éléments en fonction de leur position dans un groupe, comme une position uniforme ou impair, CSS ": nième-enfant ()»Le sélecteur est utilisé qui définit si l'élément est uniforme ou impair.

Ce message expliquera la méthode pour styliser les éléments pair et étranges dans CSS.

Comment styliser des éléments uniques et étranges?

La syntaxe pour styliser les éléments pair ou étranges est mentionné ci-dessous:

li: nième-enfant (Odd / même)
Propriété CSS

Maintenant, essayez la procédure donnée pour coiffer les éléments pair et étranges dans un conteneur «div».

Étape 1: insérer

Ajoutez une rubrique avec l'aide du "

”Tag et insérer le texte entre la balise de cap. Le "

”Définit le niveau de niveau un.

Étape 2: Créez un élément «div»

Créer un "div«Contaiteur avec l'aide du«”Élément et attribuez-le un"classe»Attribut avec un nom spécifique.

Étape 3: Ajouter la liste

Ajouter "

  • ”TAG pour répertorier l'élément:

    Créateurs de contenu LinuxHint



  • Discorde

  • HTML / CSS

  • javascrip

  • Git

  • Docker

  • les fenêtres

  • Sortir

    Étape 4: Liste de style

    Maintenant, accédez au «div"Élément utilisant la classe attribuée".liste de style»Et appliquez les propriétés ci-dessous:

    .liste de style
    Border: 5px RVB solide (17, 241, 241);
    marge: 50px;
    rembourrage: 20px;

    Ici:

    • "frontière»Définit une frontière ou un contour pour un élément.
    • "marge"Alloue un espace autour de la limite définie de l'élément.
    • "rembourrage»Spécifie l'espace à l'intérieur de la bordure:

    Étape 5: Style Éléments étranges

    Pour styliser les éléments étranges du conteneur, accédez d'abord aux anciens éléments en utilisant le «Li: nième enfant (Odd)". Le "nth-child ()"Est un sélecteur qui correspond à chaque élément nième enfant de son parent, où"n«Peut être un élément de nombre ou de mot-clé (impair ou même). Ensuite, appliquez les propriétés ci-dessous:

    li: nième-enfant (Odd)
    taille de police: 20px;
    Contexte: RVB (12, 189, 233);
    Couleur blanche;

    Ici le "taille de police"Spécifie la taille de la police,"arrière-plan"Définit la couleur de l'arrière-plan et"couleur»La propriété est utilisée pour spécifier la couleur du texte.

    On peut observer que les éléments impairs ont été coiffés en utilisant les propriétés CSS:

    Étape 7: Style pair éléments

    Pour styliser les éléments pair, accédez aux éléments pair en utilisant le «Li: nième enfant (même)". Ensuite, appliquez les propriétés CSS en fonction de votre préférence. Par exemple, le «taille de police","arrière-plan", et "couleur" sont utilisés:

    li: nième-enfant (même)
    taille de police: 20px;
    Contexte: RVB (167, 235, 10);
    Couleur: RVB (238, 15, 15);

    Sortir

    De plus, l'utilisateur peut appliquer CSS sur des éléments pair et étranges pour les styliser:

    Nous vous avons appris à styliser des éléments même étranges.

    Conclusion

    Pour styliser les éléments pair et étranges, créez un "»Et ajoutez des éléments sous la forme d'une liste en utilisant le«

  • " étiqueter. Ensuite, accédez aux éléments pair ou étranges en utilisant le «Li: Nth-Child ()"Et où le"nth-child ()»Selector compare chaque élément d'un nième nième avec son parent. Le "n«Peut être un mot ou un numéro clé, qu'il soit uniforme ou étrange. Ensuite, appliquez des propriétés CSS telles que «taille de police","couleur", et "arrière-plan”Pour le style. Ce message a démontré la méthode la plus simple pour styliser les éléments uniformes ou étranges.