Curso de HTML | Selectores avanzados de CSS

<style>
input + span{
	background: purple;
	color: white
} 
/*alt gr + 4 para dibujar símbolo*/
input ~ div{
		background: green;
		color: white
	} 
</style>

<div>
	<input type="text"><span>span con color de fondo</span><span>span con color de fondo</span>

	<br>

	<input type="text">
	<div>div al mismo nivel</div>
	<div>div al mismo nivel</div>
</div>

<div>
	<span>span sin color de fondo</span>
</div>

<style>
	input{
		display: none;
	}
	input:checked + .texto{
		background: red
	}
</style>
<label for="pulsable">pulsable</label>
<input id="pulsable" type="checkbox">
<span class="texto">amor</span>

Al pulsar sobre un texto debe hacerse visible un texto contiguo. Al volver a pulsar, debe volver a hacerse invisible

Utilizando el estilo background-position para desplazar la imagen de fondo del label, crear un checkbox personalizado.

Utilizando los selectores :first-child, :last-child, :nth-child(n) y utilizando el siguiente código html, realizar la maquetación indicada a continuación.

<div id="ventana">
	<div></div
	><div>
	<div></div
	><div></div
	><div></div>
	</div
	><div></div>		
</div>