Seletores CSS

seletores.css

    /* Seletor Universal */
    * { 
        color: #ff0;
        background-color: skyblue;
    } */
    
    /* Seletor de Classe */
    .tag { 
        color: #ff0;
        background-color: skyblue;
    }
    
    /* Seletor de Id */
    #aprovados { 
        color: #ff0;
        background-color: skyblue;
    }

    /* Seletor de Id aninhado */
    #aninhado>div {
        color: #ff0;
        background-color: rgb(163, 149, 243);
    }

    /* Seletor de descendente */
    #aninhado span {
        background-color: tomato;
    } */

    /* Seletor de irmão adjacentes */
    p+ul {
        color: silver;
    }

    /* Seletor de irmãos adjacentes e não adjacentes */
    p~ul {
        color: yellowgreen;
    }

    p~ol {
        color: black;
    }

    /* Seletor de Atributo */
    [feira] {
        background-color: purple;
    }

    /* Seletor de Atributo Específico */
    [feira=casa] {
        color: yellow;
    }

    /* Seletor de Atributos Específicos e Compostos */
    [feira~=escritorio] {
        color: gold;
    }

    /* Seletor de Atributo por 'Termos' */
    [feira*=presa] {
        color: orangered;
    }

    /* Dentro da Section primeiro elemento | section nolabel */
    section > :nth-child(1) {
        color: darkblue;
    }

    /* Dentro da Section elementos ímpares | section nolabel */
    section> :nth-child(odd) {
        color: darkblue;
    }

    /* ol sem nolabel.. pares viram ímpares.. pq label =1 */
    ol :nth-child(even) {
        color: darkred;
    }

    /* 2o span da section */
    section>span:nth-of-type(2) {
        background-color: rgb(204, 21, 158);
    }