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 9 / 44
Exibindo atualmente 24 casos
0193Efeitos visuais criativos

Campo de partículas interativo do jardim noturno

Complete uma cena de partículas interativas no ambiente da floresta noturna: inclui conteúdo real, controles operáveis, feedback de estado claro e layout adaptável a diferentes tamanhos de tela.

Efeitos visuais criativosCampo de partículas interativasHTMLCanvasJavaScript
Abrir e executar
0194Desenho e visualização de dados

Gráfico de barras interativo do progresso de aprendizado

Crie um gráfico de barras interativo para o cenário de progresso de aprendizagem: inclui conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo a diferentes tamanhos.

Desenho e visualização de dadosGráfico de barras interativoHTMLCanvasJavaScript
Abrir e executar
0195Capacidades de mídia e dispositivos do navegador

Painel de informações da viewport do espaço de demonstração

Concluir um painel de informações de viewport em um cenário de espaço de apresentação: inclui conteúdo real, controles operáveis, feedback de status claro e layout responsivo a diferentes tamanhos.

Capacidades de mídia e dispositivos do navegadorPainel de informações da viewportHTMLCSSBrowser API
Abrir e executar
0196Miniaplicativos e minijogos

Calculadora portátil para o intervalo

Conclua uma calculadora portátil para o cenário de pausa entre aulas: inclua conteúdo real, controles acionáveis, feedback claro de estado e layout responsivo em diferentes tamanhos.

Miniaplicativos e minijogoscalculadora portátilHTMLCSSJavaScript
Abrir e executar
0197Controles básicos e seletores

Matriz de alternância de preferências do modo de leitura

Conclua a matriz de alternância de preferências no cenário de modo de leitura: inclui conteúdo real, controles interativos, feedback de estado claro e layout responsivo a diferentes tamanhos.

Controles básicos e seletoresMatriz de alternadores de preferênciasHTMLCSSJavaScript
Abrir e executar
0198Formulários e entrada

Fluxo de preenchimento em etapas para matrícula em curso

Em um cenário de matrícula em curso, conclua um fluxo de preenchimento em etapas: inclui conteúdo real, controles operáveis, feedback de estado claro e layout adaptável a diferentes tamanhos.

Formulários e entradaFluxo de preenchimento em etapasHTMLCSSJavaScript
Abrir e executar
0199Navegação e menus

Navegação por breadcrumbs da base de conhecimento

Completa a navegação por breadcrumb no cenário de base de conhecimento: inclui conteúdo real, controles operáveis, feedback de estado claro e layout responsivo em diferentes tamanhos.

Navegação e menusNavegação por breadcrumbsHTMLCSSJavaScript
Abrir e executar
0200Sobreposições e feedback de estado

Gaveta lateral do centro de tarefas

Conclua um painel lateral deslizante no cenário do centro de tarefas: inclui conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo entre tamanhos.

Sobreposições e feedback de estadogaveta lateralHTMLCSSJavaScript
Abrir e executar
0201Cartões, listas e organização de conteúdo

Quadro de tarefas de design

Em um cenário de tarefas de design, conclua um quadro de tarefas: com conteúdo real, controles acionáveis, feedback de estado claro e layout adaptável a diferentes tamanhos.

Cartões, listas e organização de conteúdoQuadro de tarefasHTMLCSS GridJavaScript
Abrir e executar
0202Tabelas e exibição de dados

Tabela de filtros combinados de notas da disciplina

Crie uma tabela de filtragem combinada em um cenário de notas de disciplinas: com conteúdo real, controles interativos, feedback claro de estado e layout adaptável a diferentes tamanhos.

Tabelas e exibição de dadosTabela de filtros combinadosHTML TableCSSJavaScript
Abrir e executar
0203Layout de página e responsividade

Layout narrativo em tela dividida para portal comunitário

Conclua o layout narrativo em tela dividida no cenário do portal da comunidade: com conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo a diferentes tamanhos.

Layout de página e responsividadelayout narrativo em tela divididaHTMLCSS GridResponsive Design
Abrir e executar
0204Páginas de cenário de marketing e conteúdo

Página de planos de preços do festival criativo

Conclua uma página de plano de preços no cenário de festival criativo: inclui conteúdo real, controles acionáveis, feedback de estado claro e layout adaptável a diferentes tamanhos de tela.

Páginas de cenário de marketing e conteúdoPágina de planos de preçosHTMLCSSJavaScript
Abrir e executar
0205Painéis e interfaces de administração

Painel de análise de tendências de escala ambulatorial

Conclua um painel de análise de tendências no cenário de escalação ambulatorial: com conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo em diferentes tamanhos.

Painéis e interfaces de administraçãoPainel de análise de tendênciasHTMLCanvasJavaScript
Abrir e executar
0206Fluxos de negócios e serviços

Fluxo de etapas de pagamento do aluguel de bicicleta

Conclua o fluxo de etapas de checkout no cenário de aluguel de bicicletas: inclui conteúdo real, controles interativos, feedback claro de estado e layout adaptável a diferentes tamanhos.

Fluxos de negócios e serviçosFluxo de etapas de checkoutHTMLCSSJavaScript
Abrir e executar
0207Tipografia e efeitos de texto

Experimento de hierarquia de peso tipográfico para revista urbana

Conclua um experimento de hierarquia de peso tipográfico em cenários de revista urbana: com conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo a diferentes tamanhos.

Tipografia e efeitos de textoExperimento de hierarquia de peso da fonteHTMLCSS TypographyJavaScript
Abrir e executar
0208Animação e microinterações

Transição de forma do botão da ferramenta de foco

Conclua a transição morfológica do botão no cenário de ferramenta de foco: inclui conteúdo real, controles interativos, feedback de estado claro e layout responsivo a diferentes tamanhos.

Animação e microinteraçõesTransição de forma do botãoHTMLCSS AnimationJavaScript
Abrir e executar
0209Efeitos visuais criativos

Formas orgânicas fluidas do Jardim Noturno

Crie formas fluidas orgânicas no cenário de jardim noturno: com conteúdo realista, controles acionáveis, feedback de estado claro e layout adaptável a diferentes tamanhos.

Efeitos visuais criativosForma fluida orgânicaHTMLCSS AnimationJavaScript
Abrir e executar
0210Desenho e visualização de dados

Gráfico de linha das tendências de progresso de aprendizagem

Complete o gráfico de linha de tendência no cenário de progresso de aprendizagem: com conteúdo real, controles operáveis, feedback de estado claro e layout adaptável a diferentes tamanhos.

Desenho e visualização de dadosgráfico de linha de tendênciaHTMLCanvasJavaScript
Abrir e executar
0211Capacidades de mídia e dispositivos do navegador

Observador de consultas de mídia da sala de demonstração

Conclua o observador de consultas de mídia em um cenário de espaço de apresentação: inclui conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo a vários tamanhos.

Capacidades de mídia e dispositivos do navegadorObservador de consultas de mídiaHTMLCSSBrowser API
Abrir e executar
0212Miniaplicativos e minijogos

Quiz rápido para o intervalo

Conclua um quiz rápido de conhecimentos para o cenário de intervalo entre aulas: inclui conteúdo real, controles operáveis, feedback de estado claro e layout responsivo a diferentes tamanhos.

Miniaplicativos e minijogosQuiz rápidoHTMLCSSJavaScript
Abrir e executar
0213Controles básicos e seletores

Controle deslizante de faixa do modo de leitura

No cenário de modo de leitura, conclua o regulador de faixa: inclui conteúdo real, controles operáveis, feedback de estado claro e layout adaptável a diferentes tamanhos.

Controles básicos e seletoresControlador de intervaloHTMLCSSJavaScript
Abrir e executar
0214Formulários e entrada

Entrada de sugestões locais para matrícula em curso

No cenário de matrícula em curso, conclua a entrada com sugestões locais: inclua conteúdo real, controles acionáveis, feedback de estado claro e layout responsivo a diferentes tamanhos.

Formulários e entradaEntrada de sugestão localHTMLCSSJavaScript
Abrir e executar
0215Navegação e menus

Abas da área de trabalho da base de conhecimento

Conclua a aba do espaço de trabalho no cenário da base de conhecimento: inclui conteúdo real, controles acionáveis, feedback claro de estado e layout entre tamanhos de tela.

Navegação e menusAbas da área de trabalhoHTMLCSSJavaScript
Abrir e executar
0216Sobreposições e feedback de estado

Pilha de mensagens do centro de tarefas

Conclua uma pilha de mensagens de aviso em um cenário de central de tarefas: inclui conteúdo real, controles acionáveis, feedback de status claro e layout responsivo a vários tamanhos.

Sobreposições e feedback de estadoPilha de mensagens de avisoHTMLCSSJavaScript
Abrir e executar