Selector contextual en CSS

El selector contextual, representado por el comando espacio (' '), permite seleccionar etiquetas anidadas dentro de un elemento padre especificado

Sintaxis

selector1 selector2 {
	
}

Apliquemos estilos a todas las etiquetas p dentro de las etiquetas div y cambiemos su color a rojo:

<div>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>

div p {
	color: red;
}

Apliquemos estilos a todas las etiquetas p dentro del elemento con #elem y cambiemos su color a rojo:

<div id="elem">
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>

#elem p {
	color: red;
}

Apliquemos estilos a todas las etiquetas p dentro de elementos con clase .block y cambiemos su color a rojo:

<div class="block">
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>

.block p {
	color: red;
}

Apliquemos estilos a todas las etiquetas b dentro de las etiquetas p, que estén dentro de las etiquetas div y cambiemos su color a rojo:

<div>
	<p>
		text <b>+</b>
	</p>
</div>

div p b {
	color: red;
}

Selector hijo,
que permite seleccionar elementos por anidación directa
Selector de hermano adyacente,
que permite seleccionar un elemento por su vecino
Selector de hermanos general,
que permite seleccionar elementos después de uno especificado
Selector universal,
que permite seleccionar todos los elementos