construcao-de-paginas-web
  • Construção de páginas web
  • Comece por aqui
    • Informação muda tudo
      • Informação muda tudo
    • Como nos comunicamos através da internet
      • Como nos comunicamos através da internet
    • Primeiras marcações
      • Primeiras marcações
      • Desafios
    • Conhecendo a linha de comando
      • Conhecendo a linha de comando
      • Desafios
    • Estruturando páginas
      • Estruturando páginas
      • Desafios
    • Páginas semânticas
      • Páginas semânticas
      • Desafios
    • Construindo formulários
      • Construindo formulários
      • Desafios
    • Começando com Git
      • Começando com Git
      • Desafios
    • Trabalhando com repositórios remotos
      • Trabalhando com repositórios remotos
    • Adicionando Áudio, Imagens, Vídeos
      • Desafios
      • Adicionando Áudio, Imagens, Vídeos
    • Começando com CSS
      • Começando com CSS
      • Desafios
    • As unidades de medidas CSS
      • As unidades de medidas CSS
      • Desafios
    • Modelo de caixa com CSS
      • Modelo de caixa com CSS
      • Desafios
    • As cores na web
      • As cores na web
    • Tipografia
      • Tipografia
    • Introdução ao modelo flexível de caixas
      • Introdução ao modelo flexível de caixas
      • Desafios
    • Posicionamento de elementos com CSS
      • Posicionamento de elementos com CSS
      • Desafios
    • Criando páginas para múltiplos dispositivos
      • Criando páginas para múltiplos dispositivos
      • Desafios
    • Criando páginas acessíveis
      • Acessibilidade
      • Desafios
  • Código de Conduta
  • Contribuindo no VaiNaWeb
Powered by GitBook
On this page

Was this helpful?

  1. Comece por aqui
  2. Modelo de caixa com CSS

Desafios

Desafio 01: Organizando a malinha do coração

Vamos pensar em coisas bonitas que guardamos no coração, escolher algumas, e organizar com CSS.

  1. Crie um documento HTML com a estrutura básica completa

  2. Crie um header, com um título e uma imagem

  3. Crie um main com quatro sections

  4. Em cada section adicione uma imagem e um parágrafo

  5. Adicione um background de sua preferência no header e em cada section

  6. Adicione um padding com o valor de sua preferência nas sections

  7. Adicione um margin com o valor de sua preferência no header

  8. Adicione uma borda sólida, com uma largura, e cor de sua preferência em cada uma das sections

PreviousModelo de caixa com CSSNextAs cores na web

Last updated 6 years ago

Was this helpful?