No contexto do CSS, considere os seguintes seletores. h1, xxxx .xxxx, #d345 #xxxx xxxx:hover A lista que indica corretamente a natureza do objeto correspondente ao símbolo “xxxx” em cada linha, respectivamente, é:
- A)classe xxxx / tag / classe xxxx / classe xxxx
Errada, porque troca a primeira posicao e a ultima, tratando tag como classe onde nao ha ponto.
- B)classe xxxx / classe xxxx / classe xxxx / tag
Errada, porque a primeira e a segunda posicoes nao batem com a sintaxe do CSS, e a ultima tambem nao e classe.
- C)tag / classe xxxx / id “xxxx” / tag
Certa, pois a sequencia e tag, classe, id e tag, exatamente como indica a sintaxe dos seletores.
- D)tag / classe xxxx / id “xxxx” / classe xxxx
Errada, porque a segunda posicao nao e classe e a ultima nao e classe, ja que em xxxx:hover continua sendo tag.
- E)tag / tag / classe xxxx / id “xxxx”
Errada, porque inverte a segunda e a terceira posicoes e nao respeita a diferenca entre ponto, cerquilha e seletor sem prefixo.
Gabarito: C
No CSS, voce identifica o tipo do seletor pelo simbolo que aparece antes do nome. Sem nada na frente, como em h1 ou em xxxx:hover, voce esta diante de um seletor de tag, isto e, um elemento HTML. Quando aparece um ponto, como em .xxxx, trata-se de uma classe. Quando aparece um jogo da velha, como em #d345 ou #xxxx, voce esta diante de um id. Na questao, o item pede a natureza do objeto representado por “xxxx” em cada linha. Em h1, xxxx, o primeiro ja mostra tag e o segundo tambem deve ser tag. Em .xxxx, #d345, o “xxxx” vem com ponto, entao e classe. Em #xxxx, o simbolo e de id. E em xxxx:hover, o “xxxx” continua sendo tag, porque o :hover so adiciona uma pseudo-classe ao elemento. Portanto, a sequencia correta e: tag, classe, id, tag. E exatamente isso que a alternativa C traz. Se voce gravar a regra basica - ponto para classe, cerquilha para id, e nada antes do nome para tag - essa questao fica resolvida em poucos segundos. Em provas da FGV, esse tipo de questao costuma cobrar leitura visual do seletor, sem complicar a teoria. O truque e nao deixar o :hover confundir voce: ele nao transforma a palavra em classe nem em id, apenas acrescenta um estado ao elemento.