Entrar Ainda não tem acesso?
1
resposta

[Dúvida] Verificador "orientation"

Referente ao curso HTML e CSS: trabalhando com responsividade e publicação de projetos, no capítulo Responsividade e atividade Media Queries

por Edimar Freitas de Sá
| 137k xp | 3 posts
Analista de treinamento técnico Pl.

Para a maioria dos casos o @media (orientation: portrait/landscape) não filtraria melhor as situações de responsividade? principalmente entre celular e outros? Para o @media (max/min-width), tem algum exemplo onde ele faça mais sentido? Tenho consciência de que depende do projeto, uma vez que o layout e elementos vão terão tamanho e relevâncias diferentes, mas, ainda assim ficou a dúvida, eu só enxergo a viabilidade do max/min-width para onde preciso ter mais de 2 opções de tamanho (não tenho experiência suficiente para imaginar tal cenário, seria por ai?

1 resposta
por Renan Lima
| 3581.6k xp | 7549 posts
Alura Scuba Team Apoio Educacional - Alura

Olá, Edimar.

Tudo bem?

O uso de @media (orientation: portrait/landscape) pode ser útil em alguns casos de responsividade, especialmente em dispositivos móveis que geralmente têm orientações diferentes de tela. Por exemplo, você pode usar essa regra de mídia para ajustar a disposição de elementos em uma página quando o dispositivo está na orientação paisagem ou retrato.

No entanto, a utilização de @media (max/min-width) é geralmente mais comum e mais flexível para controlar a responsividade em vários dispositivos, independentemente de sua orientação.

Em resumo, a escolha entre usar @media (orientation: portrait/landscape) ou @media (max/min-width) dependerá do seu projeto e do comportamento que você deseja para sua página em diferentes dispositivos e orientações. Para projetos mais simples, talvez seja suficiente usar apenas a regra de orientação. Para projetos mais complexos que precisam ser exibidos em vários dispositivos e tamanhos de tela, é provável que você precise usar @media (max/min-width) para controlar a responsividade de forma mais precisa.

Valeu.