Kako ciljati CSS klasu unutar druge CSS klase

”. Zatim dodijelite atribut klase za daljnju upotrebu.

Korak 2: Napravite ugniježđene 'div' spremnike

Zatim napravite ugniježđene div spremnike slijedeći isti postupak iz koraka 1:

< div razreda = 'glavni sadržaj' >

< div razreda = 'stol' >

< div razreda = 'red' >

< div razreda = 'rascjep' > oženiti se < / div >

< div razreda = 'c-desno' > Utičnica < / div >

< div razreda = 'rascjep' > Tom < / div >

< div razreda = 'c-desno' > srpanj < / div >

< / div >

< / div >

< / div >

Izlaz

---

---

Korak 3: Primijenite stil na glavni 'div' spremnik

Pristup glavnom ' div ' spremnik uz pomoć naziva klase kao ' .glavni sadržaj ”:

.glavni sadržaj {

širina : 40% ;

margina : 0 auto ;

boja : plava ;

granica : 2 px točkasta plava ;

poravnanje teksta : centar ;

}

Ovdje:

• “ širina ” određuje veličinu širine elementa.
• “ margina ” dodjeljuje prostor oko elementa izvan definirane granice.
• “ boja ” definira boju dodanog teksta u elementu.
• “ granica ” definira obris ili granicu oko elementa u HTML-u.
• “ Poravnanje teksta ” definira poravnanje teksta elementa.

Korak 4: Stilizirajte drugu klasu

Pristupite glavnoj CSS klasi i drugim ugniježđenim klasama koristeći njihova imena. Zatim postavite širinu spremnika navodeći vrijednost prema svom izboru:

.glavni sadržaj .stol {

širina : 80% ;

}

Nadalje, pristupite drugoj klasi slijedeći isti postupak kao gore i primijenite CSS svojstva navedena u donjem isječku koda:

.glavni sadržaj .c-desno {

prikaz : inline-blok ;

veličina fonta : 20 px ;

}

Prema gornjem isječku koda:

• “ prikaz ” Svojstvo se koristi za postavljanje prikaza elementa.
• “ veličina fonta ” određuje veličinu teksta dodanog u spremnik.

Sada pristupite drugim klasama korištenjem iste metode i primijenite sljedeća CSS svojstva kao što je navedeno u nastavku:

.glavni sadržaj .rascjep {

širina : 140 px ;

margin-desno : 6px ;

veličina fonta : 16 px ;

}

Da bismo to učinili, primijenit ćemo ' širina ”, “ margin-desno ' i ' veličina fonta ” za potrebe stiliziranja.

Štoviše, pristupite glavnom ' div ” zajedno s drugim ugniježđenim div spremnikom korištenjem naziva njihove klase i primjenom sljedećih CSS svojstava

.glavni .c-desno {

širina : auto ;

veličina fonta : 15 px ;

boja : #F F F ;

margin-desno : 20 px ;

težina fonta : normalan ;

}

Izlaz

To je sve o ciljanju CSS klase unutar druge CSS klase.

Zaključak

Za ciljanje CSS klase unutar druge CSS klase, prvo pristupite glavnom ' div ” kroz dodijeljeni atribut klase. Zatim pristupite drugom 'div' spremniku slijedeći isti postupak. Nadalje, korisnici mogu ciljati CSS klasu unutar druge CSS klase. Ovaj post je pokazao metodu za ciljanje CSS klase unutar druge CSS klase.