Pular para o conteúdo principal

Questão de Programação — CSS (Cascading Style Sheets) — FCC 2022

ProgramaçãoCSS (Cascading Style Sheets)
Código
fc067308
Banca
FCC
Órgão
TRT - 5ª Região (BA)
Ano
2022
Cargo
Analista Judiciário - Tecnologia da Informação
Atenção: O código da página web a seguir deve ser utilizado para responder a questão.


   <!DOCTYPE html>
   <html>
           <head>
                    <title>Home</title>
                    <meta charset="UTF-8">
                    <style>
                            I
                          {
                               background-color: lightblue;
                           }
                            II
                          {
                               color: red;
                          }
                    </style>
            </head>
            <body>
                   <p class="p1">TRIBUNAL REGIONAL DO TRABALHO DA 5ª REGIÃO</p>
                   <p id="p2">Estado da Bahia</p>
                   <button onclick="trocar()">Trocar Estado</button>
                   <script>
                          function trocar() {
                                 III;
                          }
                    </script>
              </body>
       </html> 
No código apresentado as lacunas I e II, que identificam respectivamente o primeiro e segundo parágrafos aos quais os estilos CSS definidos serão aplicados, devem ser corretamente preenchidas por
  1. A.p1 e .p2
  2. B#p1 e .p2
  3. C.p1 e #p2
  4. D@p1 e #p2
  5. E#p1 e #p2
Revelar gabarito e comentário

GabaritoC — .p1 e #p2

Comentário gerado por IA. É um apoio ao estudo, ancorado em fontes, mas pode conter imprecisões — confira sempre na fonte oficial (lei, súmula, edital e gabarito da banca). Encontrou um erro? Use “Reportar”.

CSS Seletores: classe e id

Gabarito: letra C. A lacuna I deve ser preenchida com o seletor de classe .p1 para aplicar o estilo ao primeiro parágrafo (que possui class="p1"), e a lacuna II com o seletor de id #p2 para o segundo parágrafo (que possui id="p2").

No CSS, o seletor de classe é representado por um ponto (.) seguido do nome da classe, enquanto o seletor de id é representado pelo símbolo # seguido do id. O código HTML mostra claramente: <p class="p1">...</p> e <p id="p2">...</p>.

1Classe (.)
Sintaxe: .nome
Atributo HTML: class="nome"
2Id (#)
Sintaxe: #nome
Atributo HTML: id="nome"
3Outros
@ → at-rules (@media, @font-face)
Não é seletor
Seletores CSS
LEVELsoulevel.com.br
Seletores CSS: Classe (.) (Sintaxe: .nome, Atributo HTML: class="nome"); Id (#) (Sintaxe: #nome, Atributo HTML: id="nome"); Outros (@ → at-rules (@media, @font-face), Não é seletor)

Alternativa A — ❌ Incorreta

.p1 e .p2: a lacuna I está correta (classe .p1), mas a lacuna II deveria ser #p2, pois o segundo parágrafo usa id, e não classe.

Alternativa B — ❌ Incorreta

#p1 e .p2: a lacuna I está errada (deveria ser .p1) e a lacuna II também (deveria ser #p2).

Alternativa C — ✅ Correta ⟵ GABARITO

.p1 e #p2: exatamente os seletores corretos para classe e id, respectivamente.

Alternativa D — ❌ Incorreta

@p1 e #p2: o símbolo @ não é usado em seletores CSS — ele é próprio das regras de at-rules (ex.: @media, @font-face). A lacuna I está inválida.

Alternativa E — ❌ Incorreta

#p1 e #p2: ambos são seletores de id, mas o primeiro parágrafo é identificado por classe, não por id.

NÃO CAIA NESSA!

A banca troca os prefixos de seletor: . (classe) e # (id). Lembre-se: `. para classe, #` para id. Olhe sempre os atributos no HTML para não se confundir.

Gabarito: letra C.

Link permanente: /questoes/fc067308