Carregando...
HTML responsivo
Telefone, tablet e desktop compartilham URL. Página responsiva adapta. HTML começa; CSS termina.
Resposta direta
1) meta viewport no head
2) larguras flexíveis
3) img fluid
media queries no CSS.
Viewport meta
html
HTML Code
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Responsive demo</title>
</head>Fluid images helper
html
HTML Code
<style>
img { max-width: 100%; height: auto; }
</style>
<img src="images/wide.jpg" alt="Wide landscape photo">Experimente
- viewport na prática
- imagem larga + CSS
- janela estreita
- compare largura fixa
Erros comuns
- esquecer viewport
- 1200px fixos
- só HTML
Resumo
- viewport essencial
- larguras/imagens fluid
- media queries CSS
- mobile cedo
🧠 Teste Seu Conhecimento
Pronto para Começar
Teste Seu Conhecimento
Desafie-se com este questionário interativo e veja o quão bem você entende o tópico
5
Perguntas
70%
Para Passar
∞
Tempo
∞
Tentativas
📝 Instruções
- Leia cada pergunta cuidadosamente
- Selecione a melhor resposta para cada pergunta
- Você pode refazer o quiz quantas vezes quiser
- Seu progresso será mostrado no topo