Hur man riktar in sig på en CSS-klass i en annan CSS-klass

”. Tilldela sedan ett klassattribut för vidare användning.

Steg 2: Gör kapslade 'div'-behållare

Gör sedan kapslade div-behållare genom att följa samma procedur i steg 1:

< div klass = 'huvudinnehåll' >

< div klass = 'tabell' >

< div klass = 'rad' >

< div klass = 'klyfta' > Gifta sig < / div >

< div klass = 'c-höger' > Jack < / div >

< div klass = 'klyfta' > Tom < / div >

< div klass = 'c-höger' > juli < / div >

< / div >

< / div >

< / div >

Produktion

---

---

Steg 3: Applicera styling på huvudbehållaren 'div'.

Få tillgång till ' div ' behållare med hjälp av klassnamn som ' .huvudinnehåll ”:

.huvudinnehåll {

bredd : 40 % ;

marginal : 0 bil ;

Färg : blå ;

gräns : 2px prickad blå ;

textjustera : Centrum ;

}

Här:

• ' bredd ” anger elementets breddstorlek.
• ' marginal ” allokerar utrymme runt elementet utanför den definierade gränsen.
• ' Färg ” definierar färgen för den tillagda texten i elementet.
• ' gräns ” definierar en kontur eller gräns runt elementet i HTML.
• ' Textjustera ” definierar justeringen av elementets text.

Steg 4: Style en annan klass

Få åtkomst till CSS-huvudklassen och andra kapslade klasser genom att använda deras namn. Ställ sedan in behållarens bredd genom att ange värdet enligt ditt val:

.huvudinnehåll .tabell {

bredd : 80 % ;

}

Dessutom får du tillgång till den andra klassen genom att följa samma procedur som ovan och tillämpa CSS-egenskaperna som nämns i kodavsnittet nedan:

.huvudinnehåll .c-höger {

visa : inline-block ;

textstorlek : 20px ;

}

Enligt ovanstående kodavsnitt:

• ' visa ”-egenskapen används för att ställa in visningen av ett element.
• ' textstorlek ” anger storleken på texten som läggs till i behållaren.

Gå nu till de andra klasserna genom att använda samma metod och tillämpa följande CSS-egenskaper som nämns nedan:

.huvudinnehåll .klyfta {

bredd : 140 pixlar ;

marginal-höger : 6px ;

textstorlek : 16px ;

}

För att göra det kommer vi att tillämpa ' bredd ”, “ marginal-höger ' och ' textstorlek ” för stylingändamål.

Dessutom får du tillgång till de viktigaste ' div ”-behållare längs andra kapslade div-behållare genom att använda deras klassnamn och tillämpa följande CSS-egenskaper

.main .c-höger {

bredd : bil ;

textstorlek : 15 px ;

Färg : #fff ;

marginal-höger : 20px ;

teckensnittsvikt : vanligt ;

}

Produktion

Det handlar om att rikta in sig på en CSS-klass i en annan CSS-klass.

Slutsats

För att rikta in sig på en CSS-klass inom en annan CSS-klass, gå först till den huvudsakliga ' div ” genom det tilldelade klassattributet. Gå sedan till en annan 'div'-behållare genom att följa samma procedur. Dessutom kan användare rikta in sig på en CSS-klass inom en annan CSS-klass. Det här inlägget har demonstrerat metoden för att rikta in sig på en CSS-klass inom en annan CSS-klass.