Velg alle barneelementer rekursivt i CSS

Velg alle barneelementer rekursivt i CSS

Den ofte brukte metoden for å velge HTML -elementene i CSS er å legge til ID eller klassevelgeren til det aktuelle elementet og deretter bruke CSS -egenskapene i elementet. Men hvis det er behov for å velge forskjellige typer barneelementer tilknyttet et enslig overordnede element. For eksempel et spennelement, et avsnittselement eller et overskriftselement som barnet til et enkelt DIV -element, "*”Symbol etterfulgt av velgeren brukes i CSS -stilelementet.

Denne artikkelen vil demonstrere metoden for å velge alle barneelementer praktisk talt.

Hvordan velge alle barneelementene rekursivt?

For å velge barneelementene, må utvikleren legge til ID- eller klassevelgeren til overordnede element med "*”Symbol på slutten i CSS -stilelementet og legg deretter til egenskapene inni det.

Eksempel

La oss legge til et enkelt eksempel for å forstå forklaringen ovenfor:


Paragraf nr. 1


> Avsnitt 2

Paragraf nr. 3


> Avsnitt 4



> Avsnitt 5


> Avsnitt 6


> Avsnitt 7


I kodebiten lagt til ovenfor:

    • En "”Element er lagt til med en klasse erklært som“klassen min”.
    • Inne i "”Element, fire underelementer er definert ved å bruke“

      ”,“”,“

      ”, Og“”Tagger med teksten”Paragraf nr. 1”,“Paragraf nr. 2”,“Paragraf nr. 3”, Og“Paragraf nr. 4”, Henholdsvis.

    • Etter avslutningen “”Tag, tre””Elementer er lagt til som ikke er assosiert med ovennevnte””Element. De blir lagt til bare for å differensiere de som er barneelementene knyttet til overordnet div og de som er uavhengige elementer.

Nå, for å velge alle barneelementene i DIV, "*”Symbol med navnet på foreldre -ID eller klasse kan brukes:

.klassen min *
Bakgrunnsfarge: PowderBlue;
Display: Block;
tekst-align: sentrum;


I ovennevnte kodebit:

    • *”Symbol blir lagt til etterfulgt av“.klassen min”Valg som er overordnet element som inneholder fire forskjellige elementer inne i det som barnelementer.
    • Inni den, "bakgrunnsfarge”Eiendom er blitt definert som“pulver blå”. Denne egenskapen tilfører bakgrunnsfargen til barneelementene.
    • Display: Block”Og“Tekstalign: Center”Egenskaper er definert for å samkjøre barnelementene til midten av grensesnittet.

Det ovennevnte eksemplet vil bruke CSS-egenskapene på barneelementene i overordnede element tilknyttet klassen “klassen min”. Disse egenskapene vil ikke bli brukt på andre elementer som ikke er barnelementene i DIV tilknyttet "MyClass" -klasse:


Det handler om å velge alle barneelementene rekursivt i CSS.

Konklusjon

For å velge alle barneelementene i et bestemt foreldreelement, er det påkrevd å legge til "*”Symbol etter ID- eller klassevelgeren til overordnede element i CSS -stilelementet. CSS -egenskapene som er lagt til i den, vil deretter bli implementert på alle barneelementene. Denne artikkelen ga en komplett guide til metoden for å velge alle barneelementene i CSS.