Wie man eine CSS -Klasse in einer anderen CSS -Klasse angeht

Klassen spielen eine entscheidende Rolle bei der Erörterung der Spezifikation eines Elements in CSS oder einer anderen Programmiersprache. Um ein paar Stile und Auswirkungen auf die HTML -Komponenten auszudrücken, werden Klassen in CSS generiert. Durch die Angabe der Eigenschaftswerte können alle CSS -Eigenschaften in die Klassenkörper hinzugefügt werden.

In diesem Beitrag wird angegeben, eine CSS -Klasse innerhalb einer anderen CSS -Klasse abzurichten.

Wie man CSS -Klasse innerhalb einer anderen CSS -Klasse angeht?

Um eine CSS -Klasse in einer anderen CSS -Klasse zu zielen. Greifen Sie dann auf einen oder mehrere Klassen in CSS zu, indem Sie ihren Namen/Wert verwenden.

Schritt 1: Fügen Sie einen Div -Container hinzu

Fügen Sie zunächst ein DIV -Element mit Hilfe von hinzu “”. Zuordnen Sie dann ein Klassenattribut zur weiteren Verwendung zu.

Schritt 2: Machen Sie verschachtelte „Div“ -Container

Machen Sie als nächstes verschachtelte Div -Container, indem Sie demselben Verfahren von Schritt 1 folgen:

Heiraten
Jack
Tom
Jully

Ausgang

Schritt 3: Styling auf dem Hauptbehälter „Div“ anwenden

Zugang zur Hauptsache “div"Container mit Hilfe des Unterrichtsnamens als".Hauptinhalt”:

.Hauptinhalt
Breite: 40%;
Rand: 0 Auto;
Farbe blau;
Grenze: 2px gepunktet blau;
Text-Align: Mitte;

Hier:

• “BreiteGibt die Breite des Elements an.
• “Rand”Weist den Raum außerhalb der definierten Grenze um das Element um.
• “Farbe”Definiert die Farbe für den hinzugefügten Text im Element.
• “Grenze”Definiert einen Umriss oder eine Grenze um das Element in HTML.
• “Textausrichtung”Definiert die Ausrichtung des Textes des Elements.

Schritt 4: Stil eine andere Klasse

Greifen Sie mit ihren Namen auf die Hauptklasse der CSS -Hauptklasse und andere verschachtelte Klassen zu. Stellen Sie dann die Breite des Containers ein, indem Sie den Wert gemäß Ihrer Wahl angeben:

.Hauptinhalt .Tisch
Breite: 80%;

Geben Sie außerdem auf die andere Klasse zu, indem Sie dieselbe Prozedur wie oben befolgen und die im folgenden Code -Snippet genannten CSS -Eigenschaften anwenden:

.Hauptinhalt .C-Rechts
Anzeige: Inline-Block;
Schriftgröße: 20px;

Nach dem obigen Code -Snippet:

• “AnzeigeDie Eigenschaft wird zum Festlegen der Anzeige eines Elements verwendet.
• “Schriftgröße”Gibt die Größe des im Container hinzugefügten Text an.

Greifen Sie nun auf die anderen Klassen zu, indem Sie dieselbe Methode verwenden und die folgenden CSS -Eigenschaften anwenden, wie unten erwähnt:

.Hauptinhalt .c-links
Breite: 140px;
Rand-Rechts: 6PX;
Schriftgröße: 16px;

Dazu bewerben wir uns “Breite","Randrecht" Und "Schriftgröße”Für Stylingzwecke.

Darüber hinaus greifen Sie auf die Hauptsache zu “divContainer entlang anderer verschachtelter Div -Container mithilfe ihres Klassennamens und wenden Sie die folgenden CSS -Eigenschaften an

.hauptsächlich .C-Rechts
Breite: Auto;
Schriftgröße: 15px;
Farbe: #fff;
Rand-Rechts: 20px;
Schriftgewicht: normal;

Ausgang

Es geht darum, eine CSS -Klasse in einer anderen CSS -Klasse zu zielen.

Abschluss

Um eine CSS -Klasse innerhalb einer anderen CSS -Klasse zu zielendiv”Durch das zugewiesene Klassenattribut. Greifen Sie dann auf einen anderen „DIV“ -Container zu, indem Sie demselben Verfahren folgen. Darüber hinaus können Benutzer eine CSS -Klasse innerhalb anderer CSS -Klasse ansprechen. Dieser Beitrag hat die Methode zur Ausrichtung auf eine CSS -Klasse innerhalb einer anderen CSS -Klasse gezeigt.