Cum să vizați o clasă CSS în interiorul unei alte clase CSS

”. Apoi, alocați un atribut de clasă pentru utilizare ulterioară.

Pasul 2: Faceți containere „div” imbricate

Apoi, creați containere div imbricate urmând aceeași procedură de la pasul 1:

< div clasă = 'conținut principal' >

< div clasă = 'masa' >

< div clasă = 'rând' >

< div clasă = 'c-stânga' > Căsătorește-te < / div >

< div clasă = 'c-dreapta' > Jack < / div >

< div clasă = 'c-stânga' > Tom < / div >

< div clasă = 'c-dreapta' > iulie < / div >

< / div >

< / div >

< / div >

Ieșire

---

---

Pasul 3: Aplicați stilul pe containerul „div” principal

Accesați principalul „ div ” container cu ajutorul numelui clasei ca „ .conținut principal ”:

.conținut principal {

lăţime : 40% ;

marginea : 0 auto ;

culoare : albastru ;

frontieră : 2px punctat albastru ;

aliniere text : centru ;

}

Aici:

• „ lăţime ” specifică dimensiunea lățimii elementului.
• „ marginea ” alocă spațiu în jurul elementului în afara graniței definite.
• „ culoare ” definește culoarea pentru textul adăugat în element.
• „ frontieră ” definește un contur sau o limită în jurul elementului în HTML.
• „ Aliniere text ” definește alinierea textului elementului.

Pasul 4: stilați o altă clasă

Accesați clasa principală CSS și alte clase imbricate folosind numele acestora. Apoi, setați lățimea containerului specificând valoarea în funcție de alegerea dvs.:

.conținut principal .masa {

lăţime : 80% ;

}

Mai mult, accesați cealaltă clasă urmând aceeași procedură ca mai sus și aplicați proprietățile CSS menționate în fragmentul de cod de mai jos:

.conținut principal .c-dreapta {

afişa : inline-block ;

marimea fontului : 20px ;

}

Conform fragmentului de cod de mai sus:

• „ afişa ” proprietatea este folosită pentru setarea afișajului unui element.
• „ marimea fontului ” precizează dimensiunea textului adăugat în container.

Acum, accesați celelalte clase utilizând aceeași metodă și aplicați următoarele proprietăți CSS așa cum este menționat mai jos:

.conținut principal .c-stânga {

lăţime : 140px ;

margine-dreapta : 6px ;

marimea fontului : 16px ;

}

Pentru a face acest lucru, vom aplica „ lăţime ”, “ margine-dreapta ' și ' marimea fontului ” în scopuri de styling.

Mai mult, accesați principalul „ div ” de-a lungul altui container div imbricat utilizând numele clasei lor și aplică următoarele proprietăți CSS

.principal .c-dreapta {

lăţime : auto ;

marimea fontului : 15px ;

culoare : #fff ;

margine-dreapta : 20px ;

grosimea fontului : normal ;

}

Ieșire

Acesta este tot despre vizarea unei clase CSS în cadrul unei alte clase CSS.

Concluzie

Pentru a viza o clasă CSS în cadrul unei alte clase CSS, mai întâi, accesați principalul „ div ” prin atributul de clasă atribuit. Apoi, accesați un alt container „div” urmând aceeași procedură. În plus, utilizatorii pot viza o clasă CSS din altă clasă CSS. Această postare a demonstrat metoda de direcționare a unei clase CSS în cadrul unei alte clase CSS.