Comment cibler une classe CSS dans une autre classe CSS

Les classes jouent un rôle crucial lors de la discussion de la spécification de tout élément dans CSS ou tout autre langage de programmation. Pour exprimer quelques styles et effets sur les composants HTML, les classes sont générées dans CSS. En donnant aux valeurs des propriétés, toutes les propriétés CSS peuvent être ajoutées au corps de la classe.

Ce message indiquera sur le ciblage d'une classe CSS dans une autre classe CSS.

Comment cibler la classe CSS dans une autre classe CSS?

Pour cibler une classe CSS dans une autre classe CSS, première, faites des conteneurs Div et ajoutez des attributs de classe dans chaque conteneur. Ensuite, accédez à une ou plusieurs classes dans CSS en utilisant leur nom / valeur.

Étape 1: Ajouter un conteneur «div»

Initialement, ajoutez un élément div à l'aide de «". Ensuite, allouer un attribut de classe pour une utilisation ultérieure.

Étape 2: Faites des conteneurs «div» imbriqués

Ensuite, faites des conteneurs Div imbriqués en suivant la même procédure de l'étape 1:

Marier
Jack
À M
Jully

Sortir

Étape 3: Appliquer le style sur le récipient principal «div»

Accéder au principal "div”Container à l'aide du nom de classe comme«.contenu principal»:

.contenu principal
Largeur: 40%;
marge: 0 auto;
Couleur bleue;
Border: 2px en pointillé bleu;
Texte-aligne: Centre;

Ici:

• "largeur»Spécifie la taille de la largeur de l'élément.
• "marge"Alloue de l'espace autour de l'élément à l'extérieur de la bordure définie.
• "couleur"Définit la couleur du texte ajouté dans l'élément.
• "frontière»Définit un contour ou une limite autour de l'élément en HTML.
• "Alignement de texte»Définit l'alignement du texte de l'élément.

Étape 4: Style une autre classe

Accéder à la classe principale CSS et à d'autres classes imbriquées en utilisant leurs noms. Ensuite, définissez la largeur du conteneur en spécifiant la valeur en fonction de votre choix:

.contenu principal .tableau
Largeur: 80%;

De plus, accédez à l'autre classe en suivant la même procédure que ci-dessus et appliquez les propriétés CSS mentionnées dans l'extrait de code ci-dessous:

.contenu principal .c-droite
Affichage: bloc en ligne;
taille de police: 20px;

Selon l'extrait de code ci-dessus:

• "afficher»La propriété est utilisée pour définir l'affichage d'un élément.
• "taille de police»Spécifie la taille du texte ajouté dans le conteneur.

Maintenant, accédez aux autres classes en utilisant la même méthode et appliquez les propriétés CSS suivantes comme mentionné ci-dessous:

.contenu principal .c-left
Largeur: 140px;
marge-droite: 6px;
taille de police: 16px;

Pour ce faire, nous postulerons "largeur","marge à droite" et "taille de police”À des fins de style.

De plus, accédez au principal «div”Conteneur le long d'un autre conteneur Div imbriqué en utilisant le nom de leur classe et appliquez les propriétés CSS suivantes

.principal .c-droite
Largeur: Auto;
taille de police: 15px;
Couleur: #FFF;
marge-droite: 20px;
Police-poids: normal;

Sortir

Il s'agit de cibler une classe CSS dans une autre classe CSS.

Conclusion

Pour cibler une classe CSS dans une autre classe CSS, accédez d'abord à la principale «div”Via l'attribut de classe attribué. Ensuite, accédez à un autre conteneur «div» en suivant la même procédure. De plus, les utilisateurs peuvent cibler une classe CSS dans une autre classe CSS. Ce message a démontré la méthode pour cibler une classe CSS dans une autre classe CSS.