Wybierz wszystkie elementy dziecięce rekurencyjnie w CSS

Powszechnie stosowaną metodą do wyboru elementów HTML w CSS jest dodanie identyfikatora lub selektora klasy konkretnego elementu, a następnie zastosowanie właściwości CSS w elemencie. Ale jeśli istnieje potrzeba wyboru różnych rodzajów elementów dziecka powiązanych z samotnym elementem nadrzędnym. Na przykład element rozpiętości, element akapitu lub element nagłówka jako dziecko jednego elementu div, „*”Symbol, a następnie selektor jest używany w elemencie stylu CSS.

W tym artykule pokazuje metodę praktycznego wyboru wszystkich elementów dziecka.

Jak rekurencyjnie wybrać wszystkie elementy dziecięce?

Aby wybrać elementy dziecięce, programista musi dodać identyfikator lub selektor elementu nadrzędnego za pomocą „*„Symbol na końcu w elemencie stylu CSS, a następnie dodaj właściwości w nim.

Przykład

Dodajmy prosty przykład, aby zrozumieć powyższe wyjaśnienie:

Paragraf # 1

> Paragraf # 2

Paragraf # 3

> Paragraf # 4

W kodzie snappet dodany powyżej:

• • A "”Element jest dodawany z klasą zadeklarowaną jako„moja klasa".
  • W środku "„Element, cztery podelementy są zdefiniowane za pomocą„

    ”,„”,„

    ", I "„Tagi z tekstem”Paragraf # 1”,„Paragraf # 2”,„Paragraf # 3", I "Paragraf # 4”Odpowiednio.

  • Po zamknięciu „”Tag, trzy„„Dodano elementy, które nie są powiązane z powyższym”" element. Są one dodawane, aby odróżnić te, które są elementami dziecięcymi powiązanymi z rodzicielskim divem i tymi, które są niezależnymi elementami.

Teraz, aby wybrać wszystkie elementy dziecięce Div, „*„Można użyć symbolu z nazwą identyfikatora nadrzędnego lub klasy:

.moja klasa *
kolor tła: proszek;
Blok wyświetlacza;
Text-Align: Center;

W powyższym fragmencie kodu:

• • „„*”Dodano symbol, a następnie„.moja klasa„Selektor, który jest elementem nadrzędnym zawierającym w nim cztery różne elementy jako elementy dziecięce.
  • Wewnątrz „„kolor tła„Własność została zdefiniowana jako„Powderblue". Ta właściwość dodaje kolor tła do elementów dziecka.
  • "Blok wyświetlacza" I "Text-Align: Center”Nieruchomości zostały zdefiniowane w celu wyrównania elementów dziecka do środka interfejsu.

Wyżej dodany przykład zastosuje właściwości CSS do elementów dziecięcych elementu nadrzędnego powiązanego z klasą „moja klasa". Te właściwości nie będą stosowane do innych elementów, które nie są elementami dziecięcymi DIV związanymi z klasą „myClass”:

Chodzi o wybór wszystkich elementów dziecięcych rekurencyjnie w CSS.

Wniosek

Aby wybrać wszystkie elementy dziecięce konkretnego elementu nadrzędnego, konieczne jest dodanie „*„Symbol po identyfikatorze lub selektorze klas elementu nadrzędnego w elemencie stylu CSS. Dodane w nim właściwości CSS zostaną wdrożone na wszystkich elementach dziecięcych. W tym artykule zawiera pełny przewodnik po metodzie wyboru wszystkich elementów dziecięcych w CSS.