Manual de Combinador CSS

combinadores CSS

o combinador é um símbolo usado para explicar a relação entre os seletores.

A tabela a seguir mostra os diferentes combinadores no CSS:

nome símbolo exemplo descrição do exemplo
combinador de filhos > div > p selecionar todos os elementos <p> que são diretamente filhos do elemento <div>.
combinador de descendentes (espaço simples) div p selecionar todos os elementos <p> dentro do elemento <div>.
separador de espaço de nomes | ns | h2 selecionar todos os elementos <h2> no espaço de nomes ns.
combinador de irmãos adjacentes + div + p selecionar o primeiro <p> elemento imediatamente após o elemento <div>.
lista de seletores , div, p Selecione todos os elementos <div> e todos os elementos <p>.
Seletor de irmão subsequente ~ p ~ ul Selecione todos os elementos <ul> que estão antes de um elemento <p>.