Как правильно писать вложенность в CSS?

Question

[Богдан Герасименко]

Как правильно писать:

div.title > a > span {}
div.title a span {}

или это одно и тоже? Для чего используется >?

Answer 1

[Максим Тимофеев]

это указание прямого потомка, добавите вложенность и первый вариант перестанет работать
div.title > a - только a именно в этом диве
div.title a - все a в этом диве не зависимо от вложенности
Для

<div class="title">
   <div class="some">
     <a

сработает только второе
для

<div class="title">
     <a

сработают оба

Answer 2

[dsmaslov]

> — указания на потомка.

div.title > a > span {} — мне нужен span, который находится в a, который находится в div.title (лучше читать справа-налево).

div.title a span {} - мне нужны все span, которые находятся во всех a, которые находятся в div.title

Answer 3

[Dymok]

Не одно и тоже.
https://puzzleweb.ru/css/selectors.php
Раздел "Комбинаторы"

Answer 4

[Mr Crabbz]

Это называется "css-селекторы". Изучите документацию по CSS:

https://htmlacademy.ru/courses/42
https://webref.ru/css/selector