Gratuito

Sites Responsivos

Aprenda a criar sites responsivos utilizando HTML e CSS

• Sobre o curso
• Aulas

• Introdução

  Olá e seja bem-vindo(a) ao curso Crie Sites Responsivos do balta.io.

  O problema

  A demanda pela criação de sites e aplicações web é uma das maiores do mercado, mas com tantas mudanças nas tecnologias, precisamos pensar em diferentes dispositivos na hora de criar nosso HTML e CSS.

  Se sua aplicação web não roda bem desde uma tela 5k até um smartphone, então seu design não é responsivo e você precisa ajustar estes detalhes.

  O que vamos aprender?

  Neste curso vamos criar utilizar a base do HTML e CSS para criar um projeto de site responsivo, com interface que se adapta aos dispositivos.

  Durante esta jornada você vai desenvolver seu conhecimento sobre HTML e CSS, se aprofundar na parte de medidas e relações, bem como aprender a utilizar Flex e Grid.

  Para quem é este curso?

  Este curso se destina a pessoas que trabalham ou querem trabalhar com desenvolvimento de aplicações Web.

  Caso você esteja começando com HTML, fica tranquilo que nossa carreira também cobre os cursos fundamentais.

  Suporte e versões

  Este curso utiliza a versão 5 do HTML e 3 do CSS (Últimas versões até a gravação deste conteúdo).

  Além disso, os conceitos apresentados aqui são atemporais e podem até mesmo serem utilizados em outras tecnologias.

  Todo conteúdo é realizado no Visual Studio Code e pode ser replicado no Windows, Mac ou Linux.

• • Módulo 1
    Apresentação do Curso
    • Apresentação do Curso - 5 mins
  • Módulo 2
    Unidades de Medida
    • Use CSS Units - 9 mins
    • Use porcentagem - 8 mins
    • Tamanhos em Imagens - 5 mins
    • Uso do min-width - 4 mins
    • Uso do EM - 7 mins
    • Problemas do EM - 3 mins
    • Uso do REM - 5 mins
    • Qual e quando utilizar - 3 mins
    • Media Queries - 4 mins
  • Módulo 3
    Páginas Flexíveis
    • Use Flexbox - 2 mins
    • Flex Direction - 7 mins
    • Use Align - 6 mins
    • Use o Space - 4 mins
    • Flex Grow - 6 mins
    • Flex Basis - 3 mins
    • Use o Align Self - 4 mins
  • Módulo 4
    Páginas em Grid
    • Use o CSS Grid - 3 mins
    • Analisando um Grid - 3 mins
    • Column e Row - 6 mins
    • Posicionamento no Grid - 6 mins
    • Fração e Auto - 3 mins
    • Semelhança com o Flex - 4 mins
    • Grip Gap - 3 mins
    • Grid Areas - 5 mins
    • Grid Areas na prática - 6 mins
    • Repeat - 2 mins
    • Pesquise mais - 2 mins
  • Módulo 5
    Projeto do Curso
    • Apresentação do Projeto - 2 mins
    • Arquitetura do Projeto - 1 mins
    • Setup do Projeto - 2 mins
    • Criando o HTML básico - 2 mins
    • Configurando o Tag Head - 3 mins
    • Configurando o Root - 3 mins
    • Criando a primeira Section - 5 mins
    • Estilizando a Section Inicial - Parte 1 - 4 mins
    • Estilizando a Section Inicial - Parte 2 - 7 mins
    • Pequenos ajustes no Layout - 2 mins
    • Criando a segunda Section - 2 mins
    • Estilizando a segunda Section - 4 mins
    • Criando a terceira Section - 3 mins
    • Estilizando a terceira Section - 3 mins
    • Criando o rodapé da página - 2 mins
    • Estilizando o rodapé da página - 4 mins
    • Responsividade na Section - Parte 1 - 4 mins
    • Responsividade na Section - Parte 2 - 3 mins
    • Responsividade na Section - Parte 3 - 2 mins

Instrutor

---

Carreiras relacionadas

---

Artigos relacionados

• Blazor Render Modes
• Blazor - Rotas e Navegação
• Uma visão geral do Blazor

---

Cursos relacionados

---

Matricule-se