Curso de HTML e CSS Online

O Curso de HTML e CSS te ensina a construir páginas web reais do zero, sem framework. Você sai sabendo estruturar conteúdo com HTML semântico, estilizar com CSS moderno (Flexbox, Grid, variáveis), criar layouts 100% responsivos para mobile e publicar o site online. No fim, monta um portfólio com landing page, página de produto e site pessoal funcionando.

Atualizado em 28 de junho de 2026 · Catálogo Affiliate University

Resumo do Curso de HTML e CSS
Curso	Curso de HTML e CSS
Formato	100% online, no seu ritmo
Duração	6 módulos, aproximadamente 9h de vídeo
Conteúdo	6 módulos · 29 aulas
Idioma	Português (Brasil)
Categoria	Programação e Dados

Por que fazer o Curso de HTML e CSS?

HTML e CSS são a base de absolutamente tudo na web: nenhum site, e-commerce, landing page ou app existe sem eles. Dominar bem semântica e responsividade é o que separa quem faz uma página que quebra no celular de quem entrega trabalho profissional. É também a porta de entrada mais barata para freela e para programação front-end, já que não exige nada além do navegador e de um editor de código gratuito.

O que você vai aprender no Curso de HTML e CSS

Estruturar páginas com HTML5 semântico (header, nav, main, section, article, footer) para acessibilidade e SEO
Construir layouts responsivos com Flexbox e CSS Grid sem usar Bootstrap
Aplicar media queries e abordagem mobile-first para o site funcionar de 320px a 4K
Usar variáveis CSS (custom properties), unidades rem/em/vw e clamp() para tipografia fluida
Criar formulários estilizados com validação nativa de HTML (required, pattern, type)
Dominar o box model, position, z-index e seletores avançados para parar de 'lutar' com o CSS
Adicionar transições, animações com @keyframes e hover states que dão acabamento profissional
Publicar o site grátis na internet com GitHub Pages, Netlify ou Vercel
Depurar layout com o DevTools do navegador (inspecionar, grid overlay, contraste)

Materiais inclusos

Pacote — Pacote com 10 templates HTML/CSS prontos (landing page, portfólio, página de produto, formulário, menu responsivo)
Swipe — Swipe file de 40 snippets de CSS para copiar e colar (centralizar, cards, botões, hero, grid de galeria)
Checklist — Checklist de responsividade e acessibilidade pré-deploy (breakpoints, alt, contraste AA, tap targets)
PDF — Cheatsheet de Flexbox e CSS Grid com todas as propriedades e exemplos visuais
Mapa mental — Mapa mental do box model e da especificidade do CSS
Modelo — Boilerplate de projeto: estrutura de pastas + reset.css + HTML inicial configurado
Código — Código-fonte completo e comentado dos 3 projetos do curso
PDF — Guia de cores, tipografia e Google Fonts: paletas e pares de fontes prontos para usar
Checklist — Passo a passo de deploy no GitHub Pages, Netlify e Vercel com prints

Currículo do Curso de HTML e CSS: módulos e aulas

Módulo 1 — Fundamentos de HTML

Como a web funciona: navegador, HTML, CSS e o que é um arquivo .html
Tags essenciais: títulos, parágrafos, listas, links e imagens
HTML semântico: header, nav, main, section, article, aside, footer
Tabelas, atributos alt e boas práticas de acessibilidade
Configurando VS Code, Live Server e a estrutura de pastas de um projeto

Módulo 2 — CSS do básico ao box model

Três formas de aplicar CSS e a ordem de especificidade
Seletores: classe, id, descendente, pseudo-classes (:hover, :nth-child)
Box model completo: margin, border, padding, content e box-sizing
Cores, fontes, Google Fonts e unidades (px, rem, em, %, vw/vh)
Display: block, inline, inline-block e o início do fluxo de layout

Módulo 3 — Layout com Flexbox e Grid

Flexbox: justify-content, align-items, gap e flex-wrap na prática
Montando um menu de navegação e cards com Flexbox
CSS Grid: grid-template-columns, areas e layouts bidimensionais
Quando usar Flexbox vs Grid em cenários reais
position: relative, absolute, fixed, sticky e z-index

Módulo 4 — Responsividade e mobile-first

Media queries e breakpoints reais (mobile, tablet, desktop)
Abordagem mobile-first: por que começar pelo celular
Imagens responsivas, srcset e object-fit
Tipografia fluida com clamp() e unidades relativas
Menu hambúrguer responsivo só com HTML e CSS

Módulo 5 — Acabamento e CSS moderno

Variáveis CSS (custom properties) e tema claro/escuro
Transições e animações com transition e @keyframes
Sombras, gradientes, border-radius e efeitos de hover
Boas práticas: organização de classes e introdução à metodologia BEM

Módulo 6 — Projetos práticos e deploy

Projeto 1: landing page de produto responsiva
Projeto 2: página de portfólio pessoal
Projeto 3: formulário de contato estilizado com validação nativa
Publicando online com GitHub Pages e Netlify/Vercel
Checklist final de qualidade: responsividade, acessibilidade e performance

Para quem é o Curso de HTML e CSS?

Para quem está começando do absoluto zero em programação e quer aprender a criar sites profissionais, e para quem já mexe em No-Code ou WordPress mas quer entender o código de verdade para personalizar qualquer layout.

Quanto tempo dura o Curso de HTML e CSS?

O Curso de HTML e CSS tem 6 módulos, aproximadamente 9h de vídeo, organizado em 6 módulos com 29 aulas. As aulas são gravadas: você estuda no seu ritmo e pode rever qualquer aula quando quiser.

Este curso faz parte do catálogo da Affiliate University. Enquanto a matrícula individual não abre, conheça as formações completas com matrícula aberta hoje:

Especialista em Inteligência Artificial Gestão de Tráfego (Facebook Ads)Seu Produto Digital em 24h

Perguntas frequentes sobre o Curso de HTML e CSS

Preciso saber programar para fazer o curso de HTML e CSS?

Não. O curso parte do zero absoluto: você só precisa de um computador, do navegador e do VS Code (gratuito). HTML e CSS são linguagens de marcação e estilo, não exigem lógica de programação prévia.

HTML e CSS são linguagens de programação?

Tecnicamente não. HTML é uma linguagem de marcação (estrutura o conteúdo) e CSS é uma linguagem de estilo (define a aparência). Elas são a base obrigatória antes de aprender JavaScript, que sim é programação.

Quanto tempo leva para aprender HTML e CSS?

Com dedicação de algumas horas por semana, dá para construir páginas responsivas em poucas semanas. Este curso tem cerca de 9h de vídeo mais 3 projetos práticos para fixar o aprendizado.

Dá para criar um site só com HTML e CSS?

Sim. Sites institucionais, landing pages e portfólios funcionam 100% só com HTML e CSS. JavaScript entra depois, para adicionar interatividade mais avançada. No curso você publica 3 sites reais online.

Preciso aprender Bootstrap ou um framework?

Não para começar. O curso ensina layout com Flexbox e CSS Grid nativos, que é o que sustenta qualquer framework. Entendendo a base, aprender Bootstrap ou Tailwind depois fica simples.

Cursos relacionados de Programação e Dados

Ver todos os cursos de Programação e Dados → · Catálogo completo