Как правильно задать стили, при нескольких уровнях вложенности?

Question

[ArtemArtemov]

Доброго времени суток, господа!
Очень большое желание развиваться в направлении front-end developer, я в начале пути. Прошу прощения за глупые вопросы.
Подскажите, пожалуйста, что я делаю не так ?
Пример jsfiddle.net/7z7hxq9q/12 .
почему div>p { color: blue } не задаёт цвет только своим потомкам, а распространяется на другие < p >, на других уровнях вложенности ?
Заранее спасибо.

Answer 1

[Mr Crabbz]

Потому что у вас в html каждый тег Р является дочерним для DIV. То есть, буквально у каждого из ваших дивов есть непосредственно-дочерний Р. Вот оно и действует.

То есть, ваш div>p в данном случае ко всем таким местам:


Решение - ограничить селектор div конкретно самым верхним в иерархии. Например, вот так: jsfiddle.net/smsnvkvc

Начните с простого: htmlacademy.ru. Там этой самой вложенности добрая четверть уроков отведена. За месяц всем азам научитесь.