Selector + y selector ~
<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>
Ocultar/Mostrar información sin Javascript
<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>
Ejercicio spoiler
Al pulsar sobre un texto debe hacerse visible un texto contiguo. Al volver a pulsar, debe volver a hacerse invisible
Ejercicio – Checkboxes personalizados
Utilizando el estilo background-position para desplazar la imagen de fondo del label, crear un checkbox personalizado.

Ejercicio formulario con check image

Ejercicio first-of-type, last-of-type, :nth-of-type(n)
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>