HTML / CSS / JavaScript

Casos completos

Escolha um caso completo, veja o resultado diretamente, modifique o código-fonte e execute-o no navegador.

1046Página 12 de 44
Exibindo atualmente 24 casos
0265Cartões, listas e organização de conteúdo

Fila de prioridade de tarefas de design

Concluir uma fila de prioridades para o cenário de tarefas de design: inclui conteúdo real, controles interativos, feedback de estado claro e layout responsivo.

Cartões, listas e organização de conteúdoFila de prioridadeHTMLCSS GridJavaScript
Abrir e executar
0266Tabelas e exibição de dados

Tabela de cartões móveis de notas da disciplina

Conclua uma tabela em cartões para dispositivos móveis em um cenário de notas de curso: com conteúdo realista, controles acionáveis, feedback de estado claro e layout adaptável a diferentes tamanhos.

Tabelas e exibição de dadosTabela em cartão para dispositivos móveisHTML TableCSSJavaScript
Abrir e executar
0267Layout de página e responsividade

Layout em cascata responsivo do portal da comunidade

Em um cenário de portal comunitário, conclua o layout em cascata responsivo: com conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo a diferentes tamanhos.

Layout de página e responsividadeLayout em cascata responsivoHTMLCSSJavaScript
Abrir e executar
0268Páginas de cenário de marketing e conteúdo

Página de contagem regressiva para o lançamento do Festival Criativo

Conclua uma página de contagem regressiva para lançamento no cenário do festival criativo: com conteúdo real, controles acionáveis, feedback de estado claro e layout adaptável a diferentes tamanhos.

Páginas de cenário de marketing e conteúdoPágina de contagem regressiva para lançamentoHTMLCSS AnimationJavaScript
Abrir e executar
0269Painéis e interfaces de administração

Painel de funil de conversão da agenda ambulatorial

Crie um painel de funil de conversão no cenário de agendamento ambulatorial: com conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo a diferentes tamanhos.

Painéis e interfaces de administraçãoPainel de funil de conversãoHTMLCSS GridJavaScript
Abrir e executar
0270Fluxos de negócios e serviços

Seleção de plano de assinatura para aluguel de bicicleta

Conclua a seleção de planos de assinatura no contexto de aluguel de bicicletas: inclui conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo entre tamanhos.

Fluxos de negócios e serviçosSeleção de plano de assinaturaHTMLCSSJavaScript
Abrir e executar
0271Tipografia e efeitos de texto

Composição tipográfica dinâmica de revista urbana

Conclua a composição tipográfica dinâmica no cenário de revista urbana: inclui conteúdo real, controles acionáveis, feedback claro de estado e layout responsivo a diferentes tamanhos.

Tipografia e efeitos de textoComposição tipográfica dinâmicaHTMLCSS AnimationJavaScript
Abrir e executar
0272Animação e microinterações

Transição de virar páginas da ferramenta de foco

No cenário de ferramenta de foco, conclua a troca de estado ao virar a página: inclui conteúdo real, controles acionáveis, feedback claro de estado e layout responsivo a vários tamanhos.

Animação e microinteraçõesAlternância de estado por virada de páginaHTMLCSS AnimationJavaScript
Abrir e executar
0273Efeitos visuais criativos

Efeito de travessia do céu estrelado no jardim noturno

Conclua um efeito de travessia estrelada no cenário do jardim noturno: com conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo em diferentes tamanhos.

Efeitos visuais criativosEfeito de travessia pelo céu estreladoHTMLCanvasJavaScript
Abrir e executar
0274Desenho e visualização de dados

Gráfico de dispersão do progresso de aprendizagem

Conclua o gráfico de dispersão no cenário do progresso de aprendizagem: inclui conteúdo real, controles operáveis, feedback de estado claro e layout responsivo em diferentes tamanhos.

Desenho e visualização de dadosGráfico de dispersãoHTMLCanvasJavaScript
Abrir e executar
0275Capacidades de mídia e dispositivos do navegador

Indicação de status de rede da sala de demonstração

Conclua a indicação do estado de conexão no cenário do espaço de apresentação: inclui conteúdo real, controles operáveis, feedback de estado claro e layout adaptável a diferentes tamanhos.

Capacidades de mídia e dispositivos do navegadorindicador de status da conexãoHTMLCSSBrowser API
Abrir e executar
0276Miniaplicativos e minijogos

Conversor de unidades para intervalo

No cenário de intervalo de estudos, conclua a calculadora de conversão de unidades: inclui conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo em vários tamanhos.

Miniaplicativos e minijogosConversor de unidadesHTMLCSSJavaScript
Abrir e executar
0277Controles básicos e seletores

Seleção de amostras de cores no modo de leitura

Concluir a seleção de amostras de cores em um cenário de modo de leitura: inclui conteúdo real, controles operáveis, feedback claro de estado e layout adaptável a diferentes tamanhos.

Controles básicos e seletoresSeleção de amostra de coresHTMLCSSJavaScript
Abrir e executar
0278Formulários e entrada

Tabela de agendamento de inscrição em cursos

Complete o formulário de agendamento de horários no contexto de matrícula em curso: inclui conteúdo real, controles acionáveis, feedback claro de status e layout adaptável a diferentes tamanhos de tela.

Formulários e entradaAgendamento por períodoHTMLCSSJavaScript
Abrir e executar
0279Navegação e menus

Navegação rápida inferior da base de conhecimento

Complete a navegação rápida no rodapé para o cenário de base de conhecimento: inclua conteúdo real, controles acionáveis, feedback claro de estado e layout adaptável a diferentes tamanhos.

Navegação e menusNavegação rápida no rodapéHTMLCSSJavaScript
Abrir e executar
0280Sobreposições e feedback de estado

Centro de notificações e central de tarefas

Conclua um centro de notificações em um cenário de centro de tarefas: inclui conteúdo real, controles acionáveis, feedback claro de estado e layout responsivo a diferentes tamanhos.

Sobreposições e feedback de estadoCentral de notificaçõesHTMLCSSJavaScript
Abrir e executar
0281Cartões, listas e organização de conteúdo

Registro expansível de tarefas de design

Conclua registros expansíveis no cenário de tarefas de design: inclui conteúdo real, controles operáveis, feedback de status claro e layout responsivo para diferentes tamanhos.

Cartões, listas e organização de conteúdoRegistro expansívelHTMLCSSJavaScript
Abrir e executar
0282Tabelas e exibição de dados

Tabela comparativa de notas de disciplinas

Complete a tabela comparativa de soluções no cenário de notas das disciplinas: conteúdo real, controles operáveis, feedback claro de estado e layout para diferentes tamanhos de tela.

Tabelas e exibição de dadosTabela de comparação de propostasHTML TableCSSJavaScript
Abrir e executar
0283Layout de página e responsividade

Layout da barra lateral fixa do portal da comunidade

Conclua um layout com barra lateral fixa no cenário de portal comunitário: inclui conteúdo real, controles acionáveis, feedback de status claro e layout responsivo a diferentes tamanhos. É possível ver o resultado online, editar o código-fonte e executar no navegador.

Layout de página e responsividadelayout de barra lateral fixaHTMLCSS GridResponsive Design
Abrir e executar
0284Páginas de cenário de marketing e conteúdo

Página de conversão para assinatura do Festival Criativo

Conclua a página de conversão de inscrição em um cenário de festival criativo: inclui conteúdo real, controles interativos, feedback de estado claro e layout responsivo a diferentes tamanhos.

Páginas de cenário de marketing e conteúdoPágina de conversão de assinaturasHTMLCSSJavaScript
Abrir e executar
0285Painéis e interfaces de administração

Painel de calor do calendário de escalas de ambulatório

Complete o painel de mapa de calor do calendário no cenário de escalação ambulatorial: inclui conteúdo real, controles interativos, feedback claro de estado e layout responsivo a diferentes tamanhos.

Painéis e interfaces de administraçãoPainel de calor do calendárioHTMLCanvasJavaScript
Abrir e executar
0286Fluxos de negócios e serviços

Acompanhamento do progresso do pedido de aluguel de bicicleta

Complete o acompanhamento do progresso do pedido em um cenário de aluguel de bicicleta: inclui conteúdo real, controles acionáveis, feedback de status claro e layout responsivo a diferentes tamanhos.

Fluxos de negócios e serviçosAcompanhamento do progresso do pedidoHTMLCSSJavaScript
Abrir e executar
0287Tipografia e efeitos de texto

Texto em ritmo de revista urbana

Conclua um texto em faixa com ritmo no cenário de revista urbana: inclui conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo a diferentes tamanhos.

Tipografia e efeitos de textoTexto em movimento rítmicoHTMLCSS AnimationJavaScript
Abrir e executar
0288Animação e microinterações

Feedback de controle elástico da ferramenta de foco

Complete o feedback do controle elástico em um cenário de ferramenta de foco: inclui conteúdo real, controles acionáveis, feedback claro de status e layout responsivo para diferentes tamanhos.

Animação e microinteraçõesFeedback elástico dos controlesHTMLCSS AnimationJavaScript
Abrir e executar