Todos

Mini Projetos

Resolução do Mini Projeto

Input de cartão de crédito

Login

Introdução

  • Introdução
  • Requisitos do Projeto
  • Iniciando o Projeto e limpando os arquivos
  • HTML

  • Criando a estrutura do HTML
  • CSS

  • CSS: Criando o Layout
  • CSS: Estilizando o Cartão
  • CSS: Estilizando o Formulário
  • JS e Interatividade

  • JS: Acessando os elementos HTML
  • JS: Formatando o número do cartão
  • JS: Transpondo outros campos para o cartão
  • JS: Aceitando apenas dígitos numéricos
  • Criando o verso do cartão
  • Fazendo o verso aparecer automaticamente
  • Animando a rotação do cartão
  • Responsividade para Mobile
  • Introdução

  • Introdução
  • Requisitos do Projeto
  • Iniciando o Projeto e limpando os arquivos
  • HTML

  • Criando a estrutura do HTML
  • CSS

  • CSS: Criando o Layout
  • CSS: Estilizando o Cartão
  • CSS: Estilizando o Formulário
  • JS e Interatividade

  • JS: Acessando os elementos HTML
  • JS: Formatando o número do cartão
  • JS: Transpondo outros campos para o cartão
  • JS: Aceitando apenas dígitos numéricos
  • Criando o verso do cartão
  • Fazendo o verso aparecer automaticamente
  • Animando a rotação do cartão
  • Responsividade para Mobile
  • Requisitos do Projeto

    Revisamos os requisitos do projeto de criar um aplicação para um formulário de cartão de crédito reativo - os dados inseridos devem atualizar o cartão automaticamente. Planejamos primeiro construir em desktop e adicionar responsividade para mobile depois. O projeto será trabalhado usando HTML, CSS e JavaScript puros, com ênfase na atualização em tempo real do cartão a medida que a informação é inserida no formulário.

    Comentários

    (0)