Selector hermano adyacente

<< Selector hijo Selector hermano general >>

Si queremos acceder únicamente a aquellos elementos que están directamente a continuación del elemento especificado (elemento hermano), utilizaremos el símbolo +, con esto seleccionaremos los hermanos que están seguidos el uno del otro, es decir, al mismo nivel.

.btn + .btn{
    border-radius: 5px;
    background-color: darkcyan;
    color: white;
}
.btn{
    margin: 2px;
}

Con el ejemplo anterior de HTML y este CSS estamos seleccionado los elementos con la clase .btn que están seguidos de otro elemento con su misma clase.

<< Selector hijo Selector hermano general >>