HTML / CSS / JavaScript

Colección de casos

Elija un caso completo para ver directamente el resultado, modificar el código fuente y ejecutarlo en el navegador.

1046Página 36 / 44
Se muestran actualmente 24 casos de ejemplo
0841Superposición y retroalimentación de estado

Panel de ayuda emergente de pistas del curso

Completa el popover de ayuda en un escenario de aviso de clase: incluye contenido realista, controles interactivos, retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Superposición y retroalimentación de estadoSuperposición de ayudaHTMLCSSJavaScript
Abrir y ejecutar
0842Tarjetas, listas y organización de contenido

Índice de contactos del cuaderno de traspaso de campo

Completa un índice de contactos en el contexto de un registro de entrega de campo: contenido real, controles accionables, estado claro y diseño adaptable a distintos tamaños.

Tarjetas, listas y organización de contenidoÍndice de contactosHTMLCSSJavaScript
Abrir y ejecutar
0843Tablas y visualización de datos

Tabla multidimensional ordenable de tablero de mantenimiento

Completa una tabla ordenable de varias columnas para el escenario del tablero de mantenimiento: incluye contenido real, controles interactivos, feedback de estado claro y un diseño adaptable a distintos tamaños.

Tablas y visualización de datosTabla de ordenación por múltiples columnasHTML TableCSSJavaScript
Abrir y ejecutar
0844Diseño de página y responsive

Diseño de contenido maestro-detalle para exposición en el aula

Completa un diseño de contenido principal y secundario en un contexto de exposición en el aula: incluye contenido real, controles accionables, retroalimentación clara de estado y un diseño adaptable a distintos tamaños.

Diseño de página y responsivediseño de contenido principal/secundarioHTMLCSSJavaScript
Abrir y ejecutar
0845Escenarios de páginas de marketing y contenido

Página de conversión de suscripción trimestral de membresía de podcast

Página de conversión de suscripción completada en un contexto de temporada de membresía de pódcast: incluye contenido real, controles accionables, feedback de estado claro y diseño adaptable a distintos tamaños.

Escenarios de páginas de marketing y contenidoPágina de conversión de suscripciónHTMLCSSJavaScript
Abrir y ejecutar
0846Interfaces de panel y administración

Panel de incidencias de la recepción general del invernadero

Completa un panel de gestión de incidencias en el contexto de la recepción de invernadero: incluye contenido real, controles accionables, retroalimentación de estado clara y una disposición adaptable a diferentes tamaños.

Interfaces de panel y administraciónTablero de gestión de incidenciasHTMLCSS GridJavaScript
Abrir y ejecutar
0847Controles y selectores básicos

Selección de muestras de color del panel de control del armario

Completa la selección de muestras de color en un escenario de consola de despensa: incluye contenido real, controles interactivos, retroalimentación de estado clara y un diseño que se ajusta a distintos tamaños.

Controles y selectores básicosSelección de muestras de colorHTMLCSSJavaScript
Abrir y ejecutar
0848Formularios y entrada

Entrada de sugerencias locales para prácticas

Completa una entrada con sugerencias locales en un contexto de registro de prácticas: incluye contenido real, controles interactivos, estados claros y un diseño adaptable a distintos tamaños.

Formularios y entradaEntrada de sugerencia localHTMLCSSJavaScript
Abrir y ejecutar
0849Navegación y menús

Menú principal adaptable para terminal de clínica

Completa el menú principal adaptable para el escenario del terminal ambulatorio: incluye contenido real, controles operables, retroalimentación clara de estado y diseño adaptable a distintos tamaños.

Navegación y menúsMenú principal adaptableHTMLCSSJavaScript
Abrir y ejecutar
0850Superposición y retroalimentación de estado

Panel de acciones inferior de la cola de medios

Completa un panel de acciones inferior para el contexto de la cola de medios: incluye contenido real, controles accionables, retroalimentación de estado clara y diseño adaptable a distintos tamaños.

Superposición y retroalimentación de estadoPanel de acciones inferiorHTMLCSSJavaScript
Abrir y ejecutar
0851Tarjetas, listas y organización de contenido

Registro desplegable de notas de campo

Completa unas registros desplegables en un escenario de cuaderno de campo: incluye contenido real, controles interactivos, comentarios de estado claros y una disposición adaptable a distintos tamaños.

Tarjetas, listas y organización de contenidoRegistro expandibleHTMLCSSJavaScript
Abrir y ejecutar
0852Tablas y visualización de datos

Encabezado fijo de detalles de entrega

Completa una cabecera fija en el escenario de detalles de entrega: incluye contenido real, controles accionables, retroalimentación clara de estado y un diseño adaptable a distintos tamaños.

Tablas y visualización de datosCabecera fijaHTML TableCSSJavaScript
Abrir y ejecutar
0853Diseño de página y responsive

Diseño narrativo en pantalla dividida de la guía del curso

Completa un diseño narrativo en pantalla dividida en un escenario de guía del curso: incluye contenido real, controles interactivos, retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Diseño de página y responsiveDiseño narrativo a dos columnasHTMLCSS GridResponsive Design
Abrir y ejecutar
0854Escenarios de páginas de marketing y contenido

Página de precios para la jornada de puertas abiertas de podcast

Completa la página de planes de precios en el escenario del día de puertas abiertas del pódcast: incluye contenido real, controles interactivos, retroalimentación de estado clara y diseño adaptable a distintos tamaños.

Escenarios de páginas de marketing y contenidoPágina de plan de preciosHTMLCSSJavaScript
Abrir y ejecutar
0855Interfaces de panel y administración

Resumen de indicadores clave del centro de control del invernadero

Completa el resumen de indicadores clave en la escena de la sala de coordinación del invernadero: incluye contenido real, controles operables, retroalimentación de estado clara y diseño adaptable a distintos tamaños.

Interfaces de panel y administraciónResumen de métricas claveHTMLCSS GridJavaScript
Abrir y ejecutar
0856Procesos comerciales y de servicio

Generador de facturas para citas de consulta externa

Completa el generador de facturas en el escenario de mesa de reservas clínicas: con contenido real, controles accionables, feedback de estado claro y diseño adaptable a distintos tamaños.

Procesos comerciales y de servicioGenerador de facturasHTMLCSSJavaScript
Abrir y ejecutar
0857Tipografía y efectos de texto

Efecto de máscara de texto de la revista de la clase

En un contexto de clase, crea un efecto de máscara de texto: incluye contenido real, controles interactivos, un estado claro y un diseño adaptable a distintos tamaños.

Tipografía y efectos de textoEfecto de máscara de textoHTMLCSS TypographyJavaScript
Abrir y ejecutar
0858Animación y microinteracciones

Feedback emergente de notificación cíclica de consulta

Completa un efecto emergente de notificación en un contexto de ciclo de consultas externas: incluye contenido real, controles interactivos, comentarios de estado claros y un diseño adaptable a distintos tamaños.

Animación y microinteraccionesretroalimentación emergente de notificacionesHTMLCSSJavaScript
Abrir y ejecutar
0859efectos visuales creativos

Formas fluidas orgánicas del vestíbulo coral

Completar formas orgánicas fluidas en el escenario del Salón Coral: incluye contenido real, controles interactivos, comentarios de estado claros y diseño adaptable a distintos tamaños.

efectos visuales creativosForma fluida orgánicaHTMLCSS AnimationJavaScript
Abrir y ejecutar
0860Dibujo y visualización de datos

Gráfico de proporción en anillo del panel de previsión pública

Completa el gráfico de anillo de proporción en el escenario del tablero de previsión pública: incluye contenido real, controles interactivos, feedback claro de estado y diseño adaptable a distintos tamaños.

Dibujo y visualización de datosGráfico de anilloHTMLCanvasJavaScript
Abrir y ejecutar
0861Capacidades de medios y dispositivos del navegador

Notas de almacenamiento local del panel de aula

Crea una nota adhesiva de almacenamiento local en el contexto de un panel de aula: incluye contenido real, controles accionables, retroalimentación clara del estado y un diseño adaptable a distintos tamaños.

Capacidades de medios y dispositivos del navegadorBloc de notas de almacenamiento localHTMLCSSBrowser API
Abrir y ejecutar
0862Miniaplicaciones y minijuegos

Selector aleatorio de la lista de clase

Completa un selector aleatorio en un escenario de estación de lista de clase: incluye contenido real, controles interactivos, estados claros y diseño adaptable a distintos tamaños.

Miniaplicaciones y minijuegosSelector aleatorioHTMLCSSJavaScript
Abrir y ejecutar
0863Controles y selectores básicos

Control de rango doble de la pantalla de demostración del armario de alimentos

Completa un control de doble intervalo en el contexto de una pantalla de demostración de alacena: incluye contenido real, controles operables, una retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Controles y selectores básicosControl de rango de dos valoresHTMLCSSJavaScript
Abrir y ejecutar
0864Formularios y entrada

Proceso de registro por pasos para la tarjeta de biblioteca

Completa un flujo de llenado por pasos en un contexto de solicitud de tarjeta de biblioteca: incluye contenido real, controles interactivos, feedback de estado claro y un diseño adaptable a distintos tamaños.

Formularios y entradaProceso de rellenado por pasosHTMLCSSJavaScript
Abrir y ejecutar