Наследование стилей

В CSS применяется механизм наследования стилей. Этот механизм предполагает, что вложенные элементы могут наследовать стили своих элементов-контейнеров.

При нескольких уровнях вложенности элементы наследуют стили только ближайшего контейнера.

Однако не ко всем свойствам CSS применяется наследование стилей. Например, свойства, которые представляют отступы (margin, padding) и границы (border) элементов, не наследуются.

Кроме того, браузеры по умолчанию также применяют ряд предустановленных стилей к элементам. Например, заголовки имеют определенную высоту и т.д.

вложенные селекторы

Для применения стиля к вложенному элементу селектор должен содержать вначале родительский элемент и затем вложенный:


	#main p{
	font-size: 16px;
	}
	

Дочерние элементы

Дочерние - это элементы первого уровня вложения.
Для обращения к дочерним элементам используется знак угловой скобки:


		.article > p{
		
		color: red;
		}
		

Сестринские элементы

Иногда такие элементы еще называют сиблинги (siblings)


		h2+div {
		color:red;
		}

здесь знак + установит значение для div непосредственно идущего после заголовка h2 на том же уровне вложения.

Заголовок + сестринский блок

Текст первого блока примет стиль

last text

Текст второго блока

last text


		p~div {
		color: blue;
		}

тильда установит значение для всех div на одном уровне с параграфом p.

Параграф ~ сестринские блоки

last text

Текст первого блока примет стиль

last text

Текст второго блока как и все примет стиль

last text