Horário de aula

Caixa de ferramentas

• Caixa de Ferramentas CodeW3C.com

Menu

• Barra de ícones
• Ícone do menu
• Acordeão
• Tab
• Tab vertical
• Título da tab
• Tab de página inteira
• Tab de passar o mouse
• Navegação superior
• Navegação superior responsiva
• Navegação dividida
• Barra de navegação com ícones
• Menu de pesquisa
• Barra de pesquisa
• Barra lateral fixa
• Navegação lateral
• Barra lateral responsiva
• Navegação de tela cheia
• Menu fora da tela
• Botão de navegação lateral ao passar o mouse
• Barra lateral com ícones
• Menu rolagem horizontal
• Menu vertical
• Navegação inferior
• Navegação inferior responsiva
• Link de navegação de borda inferior
• Link de menu alinhado à direita
• Link de menu centralizado
• Link de menu isento
• Menu fixo
• Barra de navegação deslizante ao rolar
• Barra de navegação oculta ao rolar
• Barra de navegação encolhida ao rolar
• Barra de navegação adesiva
• Barra de navegação na imagem
• Menu suspenso ao passar o mouse
• Menu suspenso ao clicar
• Menu suspenso em cascata
• Menu suspenso na barra de navegação superior
• Menu suspenso no painel lateral
• Barra de navegação responsiva com menu suspenso
• Menu de navegação inferior
• Menu suspenso
• Menu super
• Menu móvel
• Menu de cortina
• Barra lateral dobrável
• Painel lateral dobrável
• Paginação
• Navegação de pão de queijo
• Grupo de botões
• Grupo de botões verticais
• Barra social adesiva
• Navegação em pílula
• Cabeçalho responsivo

Imagem

• Slide
• Galeria de slides
• Imagem modal
• Lightbox
• Grade de imagens responsiva
• Grade de imagens
• Biblioteca de imagens
• Biblioteca de imagens rolável
• Biblioteca de imagens de guia
• Desvanecimento sobreposto de imagem
• Deslize sobreposto de imagem
• Zoom sobreposto de imagem
• Título sobreposto de imagem
• Ícone sobreposta de imagem
• Efeito de imagem
• Imagem preta e branca
• Texto de imagem
• Bloco de texto de imagem
• Texto de imagem transparente
• Imagem de página inteira
• Formulário na imagem
• Foco de imagem
• Imagem de fundo borrada
• Fundo alternado ao rolar
• Imagens em paralelo
• Imagem arredondada
• Imagem de avatar
• Imagem responsiva
• Imagem centralizada
• Miniatura
• Borda de imagem
• Introdução da equipe
• Imagem adesiva
• Imagem girada
• Imagem sacudida
• Galeria de coleção
• Coleção filtrável
• Zoom de imagem
• Lupinha de imagem
• Slider de comparação de imagens
• Ícone do site

Botão

• Botão de aviso
• Botão contornado
• Botão divisório
• Botão animado
• Botão de gradiente
• Botão na imagem
• Botão de mídias sociais
• Leia mais/Leia menos
• Botão de carregamento
• Botão de download
• Botão em pílula
• Botão de notificação
• Botão de ícone
• Botão de página seguinte/anterior
• Botão mais na navegação
• Botão em bloco
• Botão de texto
• Botão arredondado
• Botão de voltar ao topo

Formulário

• Formulário de login
• Formulário de registro
• Tabela de checkout
• Formulário de contato
• Tabela de login social
• Formulário de registro
• Formulário com ícone
• Inscrição em newsletter
• Formulário empilhado
• Formulário responsivo
• Formulário emergente
• Formulário em linha
• Limpar caixa de entrada
• Ocultar setas numéricas
• Copiar texto para a área de transferência
• Pesquisa animada
• Botão de pesquisa
• Pesquisa em tela cheia
• Caixa de entrada na barra de navegação
• Formulário de login na barra de navegação
• Caixa de seleção personalizada/caixa de seleção de opção única
• Caixa de seleção personalizada
• Interruptor de alternância
• Marcar caixa de seleção
• Detecção de travamento de maiúsculas
• Ativação de botão com tecla Enter
• Validação de senha
• Alternar visibilidade da senha
• Formulário de multi-passos
• Conclusão automática
• Desativar conclusão automática
• Desativar verificação ortográfica
• Botão de upload de arquivo
• Validação de entrada vazia

Filtros

• Lista de filtro
• Tabela de filtro
• Elemento de filtro
• Caixa de seleção de filtro
• Lista ordenada
• Tabela ordenada

Tabela

• Tabela zebra
• Tabela centralizada
• Tabela de largura total
• Tabela aninhada
• Tabela em lista
• Tabela responsiva
• Tabela de comparação

Mais

• Vídeo de tela cheia
• Caixa de diálogo
• Caixa de diálogo de exclusão
• Linha do tempo
• Indicador de rolagem
• Barra de progresso
• Barras de habilidade
• Controlador de faixa de intervalo
• Seletor de cor
• Campo de e-mail
• Dica de ferramenta
• Elemento exibido ao passar o mouse
• Janela popup
• Conteúdo dobrável
• Calendário
• HTML contém
• Lista de tarefas pendentes
• Carregador
• Insígnia
• Avaliação estrelada
• Avaliação do usuário
• Efeito de sobreposição
• Chip de contato
• Cartão
• Cartão flip
• Cartão de perfil
• Cartão de produto
• Aviso
• Caixa de diálogo de sugestão
• Nota
• Tag
• Faixa
• Nuvem de tags
• Círculo
• Linha horizontal estilizada
• Cupom
• Grupo de lista
• Grupo de lista com insígnia
• Lista sem marcadores
• Texto responsivo
• Texto de sombra
• Texto brilhante
• Rodapé fixo
• Elemento adesivo
• Altura igual
• Limpar flutuante
• Flutuante responsivo
• Barra de notificação
• Janela de tela cheia
• Desenho de rolagem
• Rolamento suave
• Fundo de gradiente ao rolar
• Cabeçalho adesivo
• Cabeçalho encolhido ao rolar
• Tabela de preços
• Scroll paralelo
• Proporção de largura e altura
• Frame inline responsivo
• Alternar gostar / não gostar
• Alternar ocultar / mostrar
• Alternar modo escuro
• Alternar texto
• Alternar classe
• Adicionar classe
• Remover classe
• Mudar classe
• Classe ativa
• Visualização em árvore
• Remover decimal
• Remover atributo
• Detecção offline
• Encontrar elemento oculto
• Redirecionar página web
• Formatação de número
• Aumento ao passar o mouse
• Caixa invertida
• Centralizado verticalmente
• Botão centralizado dentro de DIV
• Lista centralizada
• Transição de sobreposição
• Seta
• Forma
• Link de download
• Elemento de altura total
• Janela do navegador
• Barra de rolagem personalizada
• Ocultar barra de rolagem
• Mostrar/forçar a mostrar a barra de rolagem
• Aparência de dispositivo
• Borda de conteúdo editável
• Cor do marcador de posição
• Desativar ajuste de tamanho da área de texto
• Desativar seleção de texto
• Cor de seleção de texto
• Cor do item de lista
• Linha vertical
• Linha de divisão
• Linha de divisão de texto
• Ícone animado
• Contador regressivo temporizador
• Efeito de máquina de escrever
• Página em breve
• Mensagem de chat
• Janela de chat popup
• Tela dividida
• Avaliação do cliente
• Contador de bloco
• Slides de citação
• Itens de lista closáveis
• Ponto de ruptura típico de dispositivo
• Elementos HTML arrastáveis
• Media query JS
• Realçador de sintaxe
• Animação JS
• Tamanho da string JS
• Operação exponencial JS
• Parâmetro padrão JS
• Número aleatório JS
• Ordenação de arrays numéricos JS
• Operador de espalhamento JS
• Scroll para vista JS
• Obter a data atual
• Obter o URL atual
• Obter o tamanho da tela atual
• Obter elemento iframe

Grade

• Layout de duas colunas
• Layout de três colunas
• Layout de quatro colunas
• Grade expandida
• Visualização de grade de lista
• Layout de colunas mistas
• Cartões de coluna
• Layout em espiral
• Layout do blog

Conversor

• Conversão de peso
• Conversão de temperatura
• Conversão de comprimento
• Conversão de velocidade

Cursos optativos

Recomendações de cursos:

• Caixa de Ferramentas CodeW3C.com

Caixa de ferramentas

Manual de referência de JavaScript e HTML DOM

Exemplo de JavaScript

Teste de JavaScript

Tutorial avançado de JavaScript

Link de patrocinador