intro css

estilos.css

/* Combinadores */

/* sólo las .cajas que sean hijas directa de .contenedor */
.contenedor > .caja {
  /*bgc*/
  background-color: green;
}

.contenedor > .caja > .caja  {
  /*fz45*/
  font-size: 45px;
}


/* seleccionando un elemento inmediatamente despues */
.contenedor > .caja + .caja {
  color: blue;
}

/* todos los hermanos de  .contenedor>.caja con etiqueta div*/
.contenedor > .caja ~ div {
  letter-spacing: 5px;
}

index.html

<!-- .caja{Algo}>(.caja{Algo mas}>.caja{Otra Cosa})+.caja{y ya} -->
  <div class="caja contenedor">
    Algo
    <div class="caja">
      Algo mas
      <div class="caja">
        Otra Cosa
      </div>
    </div>

    <div class="caja">
      y un poco más
    </div>

    <div>
      Interrupcion
    </div>

    <div class="caja">
      y ya
    </div>
  </div>