Потомък - CSS-трикове

Anonim

Селектор на потомци в CSS е всеки селектор с бяло разстояние между два селектора без комбинатор. Ето няколко примера:

ul li ( ) header h2 ( ) footer a ( ) .module div ( ) #info-toggle span ( ) div dl dt a ( )

Вземете ul li ( )например. Това означава „всеки елемент от списъка, който е потомък на неподреден списък.“

Descendant означава навсякъде, вложено в него в DOM дървото. Може да е пряко дете, може да бъде дълбоко пет нива, все още е потомък. Това е различно от дъщерния комбинатор (>), който изисква елементът да бъде следващото вложено ниво надолу.

За илюстрация div span ( )ще съвпадат:

 I will match
  • I will match too

Вероятно не бива да се притеснявате много, но селективният селектор е доста „скъп“ - което означава трудно / бавно за рендиране на двигатели, за да разберете и да правите неща. MDN:

Селекторът за потомци е най-скъпият селектор в CSS. Това е ужасно скъпо - особено ако селекторът е в категорията Tag или Universal.

Но само в сравнение с други селектори. Все още е пламнало бързо и вероятно никога няма да го забележите, освен ако не полудеете.

Поддръжка на браузър

Chrome Сафари Firefox Опера IE Android iOS
Всякакви Всякакви Всякакви Всякакви Всякакви Всякакви Всякакви