Selectores CSS
Selector >
El selector > está indicando que el elemento a ser afectado por la regla es el elemento de la derecha cuando tiene al de la izquierda como su padre.
Ejemplo:div > span.texto-rojo { color: red; }
Este valor no se ve afetado aun aplicando la clase .texto-rojo ya que es un <p> y no un <span>.
Selector +
Este selector referencia al elemento de la derecha cuando es inmediatamente precedido por el de la izquierda. Ambos elementos deben compartir el mismo padre.
Ejemplo:span.texto-rojo + span{ color: blue; }
Selector ~
Este selector es similar al anterior pero el elemento afectado no necesita estar precediendo de inmediato al elemento de la izquierda. Además, más de un elemento puede ser afectado.
Ejemplo:span.texto-rojo ~ p { color: darkgreen; }
Este elemento p es el primero que es precedido por el span al que aplica la clase "texto-rojo".
Este elemento p es el segundo que es precedido por el span al que aplica la clase "texto-rojo".
Este elemento p es el tercero que es precedido por el span al que aplica la clase "texto-rojo" pero tiene un padre diferente.
Selector *
Este selector es el selector universal. Eso quiere decir que lo definido utilizando este selector aplica a todo el documento.
Ejemplo:* { margin: 0px; padding: 0px; }
Esta regla hace que se aplique un margen y padding en 0px;