Analista do Tesouro Estadual - Área de Conhecimento: Tecnologia da Informação (prova 2)
Considere o comando CSS3:@media (max-width: 600px) {.container {flex-direction: column;}}Esse comando
Aaltera a propriedade flex-direction para column sempre que a altura do.container estiver abaixo de 600px, independentemente da largura.
Bgarante o layout de coluna no.container para qualquer dispositivo móvel, sem levar em conta a largura da tela.
Caplica a propriedade flex-direction: column ao.container, fazendo com que seus elementos sejam alinhados verticalmente quando a largura do dispositivo estiver em até 600px.
Ddefine a largura do.container como exatamente 600px a partir do momento em que a tela atinge ou fica abaixo desse valor, ignorando qualquer modificação posterior de largura.
Ealtera a direção do flex para column apenas quando a largura do dispositivo exceder 600px, sem afetar resoluções menores.
Revelar gabarito e comentário▾
GabaritoC — aplica a propriedade flex-direction: column ao.container, fazendo com que seus elementos sejam alinhados verticalmente quando a largura do dispositivo estiver em até 600px.
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”.
CSS3 – Media Query e Flexbox
Gabarito: letra C. A media query @media (max-width: 600px) aplica o estilo CSS contido nela quando a largura da viewport for igual ou inferior a 600px (max-width = largura máxima). A regra flex-direction: column alinha os itens do container verticalmente, exatamente como descrito na alternativa C.
A questão testa a interpretação correta da expressão max-width, que define um limite superior de largura para a aplicação da regra. O dispositivo deve ter largura de tela de até 600px para que o estilo seja ativado.
Alternativa A — ❌ Incorreta
Afirma que a media query depende da altura ("altura do .container"). No entanto, max-width refere-se à largura, não à altura. Além disso, a condição se aplica à viewport (janela do navegador), e não especificamente à altura do .container.
Alternativa B — ❌ Incorreta
Diz que o layout será aplicado a "qualquer dispositivo móvel, sem levar em conta a largura". Isso é falso, pois a media query condiciona a aplicação a um limite de largura. Dispositivos móveis com largura superior a 600px (como muitos tablets em modo paisagem) não sofreriam o efeito.
Alternativa C — ✅ Correta ⟵ GABARITO
A redação está correta: "aplica a propriedade flex-direction: column ao .container, fazendo com que seus elementos sejam alinhados verticalmente quando a largura do dispositivo estiver em até 600px". A expressão "em até 600px" equivale a max-width: 600px, ou seja, larguras menores ou iguais a 600px.
Alternativa D — ❌ Incorreta
Afirma que o comando define a largura do container como 600px. Na verdade, a media query não altera a largura; ela aplica um estilo condicional ao container. A largura do container permanece conforme definida por outras regras CSS.
Alternativa E — ❌ Incorreta
A alternativa inverte o sentido: diz que a alteração ocorre "apenas quando a largura do dispositivo exceder 600px". max-width significa largura máxima, ou seja, o estilo é aplicado para larguras até 600px, e não acima desse valor. O correto seria min-width: 600px para o comportamento descrito.
PEGA ESSA DICA!
Na hora da prova, associe max-width a "largura máxima = até esse valor" e min-width a "largura mínima = a partir desse valor". Uma tabela mental ajuda: