Maria escolheu utilizar uma folha de estilo em cascata (CSS3) para controlar a aparência das páginas do seu site de Internet. A sintaxe do seletor CSS que Maria deve usar para aplicar um determinado estilo somente aos elementos <li> que estiverem diretamente dentro de elementos <ul>, é
- A)ul.li
Errada, porque "ul.li" indicaria um elemento ul com classe li, e não uma relação entre ul e li.
- B)ul > li
Certa, pois ">" é o combinador de filho direto, selecionando apenas os imediatamente dentro de .
- C)ul + li
Errada, porque "+" seleciona o irmão adjacente, isto é, um elemento logo após outro no mesmo nível.
- D)ul ~ li
Errada, porque "~" seleciona irmãos gerais, não filhos diretos dentro de um elemento.
- E)ul , li
Errada, porque a vírgula separa seletores independentes, aplicando o estilo a ul e li separadamente.
Gabarito: B
Em CSS, o seletor indica exatamente quais elementos receberão o estilo. Quando você quer atingir apenas os elementos que são filhos diretos de outro elemento, usa o combinador de filho direto, representado por ">". Ele é mais restrito do que o seletor por descendência, que pegaria também elementos mais profundos na árvore DOM. Na questão, a ideia é estilizar somente os que estejam diretamente dentro de . Isso significa que o precisa ser filho imediato do , sem intermediários no meio. Por isso, a forma correta é "ul > li". As outras opções confundem relações diferentes entre elementos: justaposição, irmão adjacente, irmãos gerais e separação de seletores. A banca gosta muito desse tipo de cobrança porque pequenas diferenças de símbolo mudam totalmente o comportamento do CSS, então vale olhar com carinho de lupa. Em resumo: para selecionar filhos diretos, use o combinador ">". É uma regra básica de CSS3 e, aqui, ela resolve exatamente o que o enunciado pediu.