Questão de Programação — Programação de front end — FGV 2025
Programação›Programação de front end
Código
fg104528
Banca
FGV
Órgão
AL-AM
Ano
2025
Nível
Superior
Cargo
Analista Legislativo - Analista de Sistema
Ao projetar uma página responsiva utilizando a abordagem Mobile First, o Analista de Sistemas deve garantir que o estilo base (móvel) seja definido primeiro e, posteriormente, as regras para telas maiores sejam aplicadas.Das estruturas Media Query abaixo, a que está sintaticamente correta e é tipicamente usada para aplicar estilos específicos para telas maiores que 768px em um projeto Mobile First é a
A@media screen and (max-width: 768px) { ... }
B@media screen and (min-width: 768px) { ... }
C@media screen and (orientation: landscape) { ... }
D@media screen, print and (width: 768px) { ... }
E@media screen and (resolution: 2x) { ... }
Revelar gabarito e comentário▾
GabaritoB — @media screen and (min-width: 768px) { ... }
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”.
Mobile First e Media Queries
Gabarito: letra B. Na abordagem Mobile First, o estilo base é para dispositivos móveis; utiliza-se min-width para aplicar estilos progressivamente a telas maiores. A media query @media screen and (min-width: 768px) é sintaticamente correta e aplica estilos para telas com largura mínima de 768px, ou seja, maiores que 768px.
A banca testa o conhecimento sobre a sintaxe e a aplicação correta de media queries no contexto Mobile First. O erro comum é confundir min-width com max-width.
Alternativa A — ❌ Incorreta
@media screen and (max-width: 768px) aplica estilos para telas com largura máxima de 768px, ou seja, para dispositivos móveis. Em Mobile First, esse tipo é usado para Desktop First (estilos base para desktop e max-width para mobile). Portanto, não atende ao requisito de aplicar estilos para telas maiores que 768px.
Alternativa B — ✅ Correta ⟵ GABARITO
@media screen and (min-width: 768px) é a sintaxe padrão para Mobile First: define estilos que serão aplicados quando a largura da viewport for igual ou superior a 768px, abrangendo telas maiores. A estrutura está sintaticamente correta (não há vírgulas ou operadores mal colocados).
Alternativa C — ❌ Incorreta
@media screen and (orientation: landscape) direciona estilos para orientação paisagem, independentemente da largura. Não atende ao requisito de largura mínima.
Alternativa D — ❌ Incorreta
A sintaxe @media screen, print and (width: 768px) é inválida: a vírgula separa listas de media queries, mas print and (width: 768px) não é uma combinação comum. Além disso, width: 768px (sem min ou max) especifica largura exata, não "maior que". Portanto, incorreta.
Alternativa E — ❌ Incorreta
@media screen and (resolution: 2x) é usada para telas com densidade de pixels 2x (retina), não para largura.
PEGA ESSA DICA!
Em Mobile First, lembre-se: "min-width para crescer, max-width para encolher". O estilo base (mobile) fica fora da media query; as media queries com min-width adicionam estilos para telas progressivamente maiores.