Une feuille de style en cascade est un code qui affecte les éléments du code HTML. L'effet combiné forme les pages Web et les sites Web. Tout langage de programmation utilisé dans le back-end utilise de préférence HTML et CSS pour développer et concevoir un front-end pour le site Web. Ces deux sont responsables des pages Web statiques. HTML et CSS ainsi que JavaScript jouent principalement un rôle dans la création d'un site Web dynamique. Dans cet article, HTML et CSS seront utilisés pour voir la page Web créée.

Parfois, nous rencontrons une telle situation où nous voulons éviter certains articles ou contenu entre le groupe des mêmes articles. Pour les spécifier manuellement coûte du temps. Ainsi, pour éviter la consommation de temps, CSS fait référence à des propriétés aussi efficaces et efficientes pour les utiliser dans le code qui est assez facilement compréhensible et rend le code gérable. Cela se fait par la propriété CSS «pas la première».

Pas: Propriété Premier enfant

Cette propriété CSS est utilisée pour sélectionner tous les contenus HTML du même type autre que le premier. Cette propriété est opposée à la propriété CSS de «CSS First of Type» qui est responsable de l'affectation uniquement du premier de la plupart du contenu HTML du même type. En plus d'ajouter un style à toutes les balises par le CSS en ligne évitant le premier, ce n'est pas: la propriété de premier enfant a supprimé l'ambiguïté qui est créée en ayant le désordre de CSS en ligne qui rend le code difficile à comprendre et à compliquer. Nous ajoutons seulement un petit morceau de code dans le CSS interne ou externe en spécifiant le contenu HTML où nous voulons appliquer cette propriété. Ensuite, le premier enfant est automatiquement affecté.

Syntaxe:
La syntaxe de la propriété Not: First-Child est la suivante:

Content_name: pas (: premier-enfant)
Valeur de la propriété; \\ tout effet que nous voulons appliquer sur les éléments HTML autres que le premier.

Exemple 1: Non: Premier enfant du paragraphe

Pour développer le concept de ne pas avoir de premier enfant, nous utilisons le

Paragraphes du contenu HTML pour appliquer cette propriété. Les paragraphes sont le contenu HTML qui serait un tas de lignes de texte. Ces lignes sont séquencées et alignées de manière à former un paragraphe. Le code contient la balise corporelle. Nous utilisons les deux titres simples et les trois paragraphes qui contiennent le texte simple de quelques mots avec eux. Nous utilisons un exemple de texte de lorem ipsum.

Nous avons juste besoin de voir les résultats de la propriété. Pour le rendre assez simple, seul ce contenu est déclaré. Ensuite, fermez les étiquettes du corps.

La section Head contient uniquement la balise de style pour en faire un CSS interne.

Utilisez la balise de paragraphe

avec la propriété Not: Premier enfant pour appliquer tous les effets sur tous les paragraphes sauf le premier. Nous ajoutons la couleur de la police rouge aux paragraphes. Fermez toutes les balises ouvertes.

Enregistrez le code avec l'extension HTML à l'éditeur de texte. Cette extension fait l'icône du fichier comme navigateur par défaut. Cette icône assure que le fichier est une page Web.

Exemple 2: Non: Premier enfant sur la liste

Les listes HTML sont un moyen important de représenter le texte. Pour implémenter la propriété CSS du sélecteur de premier enfant, nous utilisons les deux listes. Pour élaborer davantage, nous devons d'abord avoir le savoir-faire des listes HTML. Deux types de listes sont créés via la langue HTML - une liste non ordonnée

et une liste ordonnée
. La façon de déclarer est la même pour les deux. À l'intérieur
et
, Tous les articles sont écrits avec
1. Mots clés.
   
   
   • élément1
   
   
   • élément2
   
   

   Maintenant, revenant à l'exemple, nous avons utilisé deux listes non ordonnées. Les deux listes sont déclarées à l'intérieur du div. Tout d'abord, considérez la section du corps HTML du code. Deux titres simples,

   et

   , sont déclarés. Ensuite, la balise div est utilisée pour déclarer un conteneur div. À l'intérieur de la div, le premier

   La liste est déclarée. Un CSS en ligne pour la propriété de marge est ajouté. Cette propriété de marge est également appliquée sur la deuxième div.

   Une propriété de marge est la valeur CSS de la distance de l'objet de la bordure de l'affichage d'arrière-plan. Par exemple, la marge de la liste ici est déclarée créer la liste à une distance spécifiée.

   Les deux listes sont déclarées de la même manière ayant trois éléments de liste. Maintenant, fermez toutes les étiquettes et dirigez-vous vers le CSS interne. L'en-tête est appliqué par la propriété de couleur de police. Ensuite, la partie principale du code et non: la propriété First-Child est appliquée.

   Cette propriété est appliquée sur le

   Tag, car les deux listes ne sont pas ordonnées. Mais assurez-vous que ces listes résident indépendamment ou sont présentes dans tout autre conteneur. Comme nous savons que nous avons déclaré les deux listes à l'intérieur de la div, nous devons mentionner le div avec le
   Tag afin que la propriété soit appliquée sur toutes les listes à l'intérieur de la div sauf la première.
   Div ul: pas (: premier-enfant)
   Color en arrière-plan: violet;
   Couleur blanche;
   Police-poids: Bold;
   Largeur: 40%;
   

   La div et

   sont appliqués avec les caractéristiques d'avoir une couleur d'arrière-plan et la couleur de la police. Le poids de la police est réglé en gras. La largeur de la liste est également déclarée.

   Fermez toutes les balises. Enregistrez le fichier et implémentez-le sur le navigateur pour voir les résultats.

   Vous verrez que la première liste apparaît par défaut sans aucune modification qui lui soit appliquée. Tandis que la deuxième liste est affectée par toutes les valeurs et propriétés que nous avons appliquées à l'étiquette de la liste non ordonnée dans la section Head.

   De même, si nous appliquons une propriété à tous les

   Tags comme nous l'avons fait auparavant mais sans utiliser la propriété Not: First-Child pour les listes, ce qui va se passer?
   Div ul
   Style de police: italique;
   

   Nous définissons le style de police en italique dans tous les UL de la div. Mais les valeurs écrites dans la propriété de sélecteur d'enfants pas d'abord sont appliquées sur toutes les listes sauf la première.

   Appliquez les deux styles sur le même code corporel. Enregistrez-le et implémentez-le. Nous voyons que le style italique est appliqué sur tous les éléments de la liste parce que nous n'avons pas mentionné la propriété Not: First-Child avec eux. Tandis que les valeurs qui ont le sélecteur sont appliquées uniquement sur la deuxième liste.

   Conclusion

   Le CSS pas: First-Child nous donne des connaissances concernant l'utilisation des propriétés CSS sur tous les éléments de HTML plutôt que le premier. La condition pour implémenter ce phénomène est que tous les contenus HTML doivent être du même type, sinon cet effet ne sera pas appliqué. Dès le début, nous avons parlé de l'utilisation de base HTML et CSS. Ensuite, le CSS n'est pas: First-Child s'explique en donnant une syntaxe qui est suivie par l'application de cette propriété. Ensuite, nous avons mis en œuvre ce concept dans deux contenus HTML différents: l'un est le paragraphe et l'autre est le conteneur div.