Exemplo de ~ e +

by Lucaskazama

HTML

<div class="first">First</div>
<div>Com estilo - Selecionado pelo "+"</div>
<div>Div sem estilo</div>
<p> Com estilo, selecionado pelo "~" </p>

CSS

.first {
        color: green;
    }
    div.first + div {
       color: pink;
    }
    
    div.first ~ p {
       color:red
    }