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 12 de 44
Se muestran actualmente 24 casos de ejemplo
0265Tarjetas, listas y organización de contenido

Cola de prioridades de tareas de diseño

Completa una cola de prioridades para el escenario de tareas de diseño: incluye contenido real, controles utilizables, retroalimentación clara de estado y un diseño adaptable a distintos tamaños.

Tarjetas, listas y organización de contenidoCola de prioridadHTMLCSS GridJavaScript
Abrir y ejecutar
0266Tablas y visualización de datos

Tabla de tarjetas móvil de calificaciones del curso

Completa una tabla de tarjetas para móvil en el contexto de las calificaciones del curso: incluye contenido real, controles interactivos, una retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Tablas y visualización de datosTabla de tarjetas para móvilesHTML TableCSSJavaScript
Abrir y ejecutar
0267Diseño de página y responsive

Diseño de cuadrícula fluida para el portal comunitario

En el contexto del portal de la comunidad, completa un diseño de cascada adaptable: incluye contenido real, controles interactivos, estados claros y un diseño adaptable a distintas pantallas.

Diseño de página y responsiveDiseño de cascada adaptableHTMLCSSJavaScript
Abrir y ejecutar
0268Escenarios de páginas de marketing y contenido

Página de cuenta atrás del lanzamiento del festival creativo

Completa una página de cuenta regresiva de lanzamiento para el contexto de un festival creativo: 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 cuenta atrás para el lanzamientoHTMLCSS AnimationJavaScript
Abrir y ejecutar
0269Interfaces de panel y administración

Panel de embudo de conversión de la programación de consultas externas

Completa un panel de embudo de conversión para escenarios de programación de consultas: incluye contenido realista, controles accionables, estados claros y diseño adaptable a diferentes tamaños.

Interfaces de panel y administraciónPanel de embudo de conversiónHTMLCSS GridJavaScript
Abrir y ejecutar
0270Procesos comerciales y de servicio

Selección de plan de suscripción para alquiler de bicicletas

Completa la selección de un plan de suscripción en un contexto de alquiler de bicicletas: incluye contenido real, controles accionables, retroalimentación de estado clara y diseños adaptables a distintos tamaños.

Procesos comerciales y de servicioSelección de plan de suscripciónHTMLCSSJavaScript
Abrir y ejecutar
0271Tipografía y efectos de texto

Composición tipográfica dinámica para revista urbana

Completa una composición tipográfica dinámica para el escenario de una revista urbana: incluye contenido real, controles interactivos, retroalimentación de estado clara y diseño adaptable a distintos tamaños.

Tipografía y efectos de textoComposición tipográfica dinámicaHTMLCSS AnimationJavaScript
Abrir y ejecutar
0272Animación y microinteracciones

Cambio de estado con volteo para herramienta de concentración

Completa el cambio de estado al pasar de página en el contexto de una herramienta de concentración: incluye contenido real, controles interactivos, una retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Animación y microinteraccionescambio de estado de páginaHTMLCSS AnimationJavaScript
Abrir y ejecutar
0273efectos visuales creativos

Efecto de travesía por el cielo estrellado del Jardín Nocturno

Completa un efecto de navegación por las estrellas para un escenario de jardín nocturno: incluye contenido realista, controles accionables, comentarios de estado claros y un diseño adaptable a distintos tamaños.

efectos visuales creativosEfecto de travesía por el cielo estrelladoHTMLCanvasJavaScript
Abrir y ejecutar
0274Dibujo y visualización de datos

Diagrama de dispersión del progreso de aprendizaje

Completa un gráfico de dispersión en un escenario de progreso del aprendizaje: incluye contenido realista, controles interactivos, una retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Dibujo y visualización de datosGráfico de dispersiónHTMLCanvasJavaScript
Abrir y ejecutar
0275Capacidades de medios y dispositivos del navegador

Indicador de estado de conexión del espacio de demostración

Completa la indicación de estado de conexión en el escenario del espacio de presentación: incluye contenido real, controles interactivos, retroalimentación de estado clara y una disposición adaptable a distintos tamaños.

Capacidades de medios y dispositivos del navegadorIndicador de estado en líneaHTMLCSSBrowser API
Abrir y ejecutar
0276Miniaplicaciones y minijuegos

Conversor de unidades para el descanso del recreo

Completa un convertidor de unidades para el contexto de un descanso entre clases: incluye contenido real, controles operables, retroalimentación de estado clara y diseño adaptable a varios tamaños.

Miniaplicaciones y minijuegosConversor de unidadesHTMLCSSJavaScript
Abrir y ejecutar
0277Controles y selectores básicos

Selección de muestras de color para modo de lectura

Selecciona muestras de color en un contexto de modo de lectura: incluye contenido real, controles interactivos, retroalimentación clara de estado y un diseño adaptable a distintos tamaños.

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

Tabla de reservas de franjas horarias para inscripción en cursos

En un escenario de inscripción a cursos, completa un formulario de reserva de franjas horarias: incluye contenido real, controles interactivos, feedback de estado claro y diseño adaptable a distintos tamaños.

Formularios y entradaTabla de citas por franja horariaHTMLCSSJavaScript
Abrir y ejecutar
0279Navegación y menús

Navegación rápida inferior de la base de conocimientos

Completa una navegación rápida inferior para un escenario de base de conocimientos: incluye contenido real, controles accionables, retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Navegación y menúsNavegación rápida inferiorHTMLCSSJavaScript
Abrir y ejecutar
0280Superposición y retroalimentación de estado

Centro de notificaciones y centro de tareas

Completar el centro de notificaciones en el contexto de un centro de tareas: incluye contenido real, controles interactivos, una retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Superposición y retroalimentación de estadoCentro de notificacionesHTMLCSSJavaScript
Abrir y ejecutar
0281Tarjetas, listas y organización de contenido

Registro expandible de tareas de diseño

Completa registros expandibles en un escenario de tareas de diseño: incluye contenido real, controles interactivos, retroalimentación de estado clara y una composición adaptable a distintos tamaños.

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

Tabla comparativa de planes de calificaciones del curso

Completa la tabla comparativa de planes en el contexto de resultados académicos: 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 comparación de propuestasHTML TableCSSJavaScript
Abrir y ejecutar
0283Diseño de página y responsive

Diseño de barra lateral fija del portal comunitario

Completa un diseño de barra lateral fija para un portal comunitario: incluye contenido real, controles accionables, comentarios de estado claros y un diseño adaptable a distintos tamaños.

Diseño de página y responsiveDiseño de barra lateral fijaHTMLCSS GridResponsive Design
Abrir y ejecutar
0284Escenarios de páginas de marketing y contenido

Página de conversión de suscripción para el festival creativo

Completa la página de conversión de suscripción para el escenario de festival creativo: incluye contenido real, controles interactivos, retroalimentación clara de estado 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
0285Interfaces de panel y administración

Panel de calor del calendario de turnos de la clínica

Completa el panel de mapa de calor del calendario en el escenario de programación de la consulta: incluye contenido real, controles interactivos, retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Interfaces de panel y administraciónPanel de calor del calendarioHTMLCanvasJavaScript
Abrir y ejecutar
0286Procesos comerciales y de servicio

Seguimiento del progreso del pedido de alquiler de bicicletas

Seguimiento del progreso de pedidos en un escenario de alquiler de bicicletas: incluye contenido real, controles interactivos, retroalimentación clara de estado y un diseño adaptable a distintos tamaños.

Procesos comerciales y de servicioSeguimiento del progreso del pedidoHTMLCSSJavaScript
Abrir y ejecutar
0287Tipografía y efectos de texto

Texto de desplazamiento rítmico de revista urbana

Completa un texto en cinta con ritmo para un escenario de revista urbana: incluye contenido real, controles interactivos, retroalimentación de estado clara y diseño adaptable a distintos tamaños.

Tipografía y efectos de textotexto en movimientoHTMLCSS AnimationJavaScript
Abrir y ejecutar
0288Animación y microinteracciones

retroalimentación de controles elásticos para herramienta de enfoque

Completa una respuesta elástica de control en un contexto de herramienta de enfoque: incluye contenido realista, controles accionables, retroalimentación de estado clara y maquetación adaptable a distintos tamaños.

Animación y microinteraccionesRetroalimentación de controles elásticosHTMLCSS AnimationJavaScript
Abrir y ejecutar