Что такое Дочерние селекторы в CSS3?

Дочерние селекторы позволяют выбрать лишь те теги, которые находятся внутри родительского элемента. К примеру, у нас есть код:

<p id="example">
	Lorem ipsum dolor sit amet, <i>consectetur</i> adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <i>Ut</i> enim ad minim veniam, <i>quis</i> nostrud exercitation ullamco laboris nisi ut aliquip <i>ex ea</i> commodo consequat.
	<div>
		Lorem <i>ipsum</i> dolor sit amet.
	</div>
</p>

Значит, чтобы выбрать все дочерние теги i нам необходимо использовать p > i. Таким образом будут выбраны лишь прямые наследники. Те теги, которые находятся в других элементах не будут использовать стили. Стоит знать: если бы мы хотели выбрать абсолютно все теги i в теге p, то мы бы использовали конструкцию вложенных селекторов (p i).

#example>i { 
	color: #ccc051;
}

<p id="example">
	Lorem ipsum dolor sit amet, <i>consectetur</i> adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <i>Ut</i> enim ad minim veniam, <i>quis</i> nostrud exercitation ullamco laboris nisi ut aliquip <i>ex ea</i> commodo consequat.
	<div>
		Lorem <i>ipsum</i> dolor sit amet.
	</div>
</p>