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

Cronología de tareas de diseño

Completa una línea de tiempo de actividades para escenarios de tareas de diseño: incluye contenido real, controles accionables, retroalimentación clara de estado y un diseño adaptable a distintos tamaños.

Tarjetas, listas y organización de contenidoCronología de actividadesHTMLCSSJavaScript
Abrir y ejecutar
0218Tablas y visualización de datos

Tabla de datos paginada de calificaciones del curso

Completa una tabla de datos paginada en el escenario de calificaciones del curso: con contenido real, controles accionables, feedback de estado claro y diseño adaptable a distintos tamaños.

Tablas y visualización de datostabla de datos paginadaHTML TableCSSJavaScript
Abrir y ejecutar
0219Diseño de página y responsive

Diseño clásico de tres columnas para el portal comunitario

Completa un diseño clásico de tres columnas para un portal comunitario: contenido real, controles accionables, feedback de estado claro y diseño adaptable a distintos tamaños.

Diseño de página y responsiveDiseño clásico de tres columnasHTMLCSS GridResponsive Design
Abrir y ejecutar
0220Escenarios de páginas de marketing y contenido

Zona de conversión de preguntas y respuestas del festival creativo

Completa el área de conversión de preguntas y respuestas en la escena del festival creativo: incluye contenido real, controles interactivos, retroalimentación de estado clara y un diseño adaptable a varios tamaños.

Escenarios de páginas de marketing y contenidoZona de conversión de preguntas y respuestasHTMLCSSJavaScript
Abrir y ejecutar
0221Interfaces de panel y administración

Flujo de actividad en tiempo real de la programación de consultas

Completa un flujo de actividad en tiempo real en un escenario de horarios de clínica: incluye contenido real, controles accionables, estados claros y diseño adaptable a distintos tamaños.

Interfaces de panel y administraciónFlujo de actividad en tiempo realHTMLCSSJavaScript
Abrir y ejecutar
0222Procesos comerciales y de servicio

Generador de promociones para alquiler de bicicletas

Completar el combinador de promociones en el escenario de alquiler de bicicletas: incluye contenido real, controles interactivos, retroalimentación de estado clara y diseño adaptable a distintos tamaños.

Procesos comerciales y de servicioCombinador de promocionesHTMLCSSJavaScript
Abrir y ejecutar
0223Tipografía y efectos de texto

Tipografía fluida de titular para revista urbana

Completa una composición de titulares fluidos en un contexto de revista urbana: incluye contenido real, controles interactivos, comentarios de estado claros y un diseño adaptable a distintos tamaños.

Tipografía y efectos de textotipografía de título fluidoHTMLCSS TypographyJavaScript
Abrir y ejecutar
0224Animación y microinteracciones

Feedback de progreso en anillo para herramienta de enfoque

Completa una retroalimentación de progreso circular en un escenario de herramienta de enfoque: incluye contenido real, controles accionables, comentarios de estado claros y una distribución adaptable a distintos tamaños.

Animación y microinteraccionesRetroalimentación de progreso circularHTMLCSS AnimationJavaScript
Abrir y ejecutar
0225efectos visuales creativos

Experimento de cuadrícula de malla degradada del jardín nocturno

Realiza una experiencia de red de gradiente en un escenario de jardín nocturno: incluye contenido real, controles interactivos, retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

efectos visuales creativosExperimento de malla degradadaHTMLCanvasJavaScript
Abrir y ejecutar
0226Dibujo y visualización de datos

Gráfico de anillo del progreso de aprendizaje

Completa el gráfico de proporción en anillo en el escenario de progreso de aprendizaje: incluye contenido real, controles interactivos, retroalimentación clara del estado y una disposición adaptable a distintos tamaños.

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

Notas de almacenamiento local para el espacio de demostración

En el contexto del espacio de presentación, completa la nota de almacenamiento local: incluye contenido real, controles interactivos, estados claros y diseño adaptable a distintos tamaños.

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

Juego de memoria de cartas para el recreo

En un descanso entre clases, completa el juego de memoria de cartas: incluye contenido real, controles interactivos, retroalimentación clara de estado y un diseño adaptable a distintos tamaños.

Miniaplicaciones y minijuegosjuego de memoria de cartas boca abajoHTMLCSSJavaScript
Abrir y ejecutar
0229Controles y selectores básicos

Escala de valoración del modo de lectura

En el escenario de modo lectura, completa la escala de valoración: incluye contenido real, controles accionables, retroalimentación de estado clara y diseño adaptable a distintos tamaños.

Controles y selectores básicosescala de valoraciónHTMLCSSJavaScript
Abrir y ejecutar
0230Formularios y entrada

Comentarios sobre la fortaleza de la contraseña para el registro en cursos

Completa la retroalimentación sobre la fortaleza de la contraseña en un contexto de inscripción a un curso: contenido realista, controles accionables, estados claros y una distribución adaptable a distintos tamaños.

Formularios y entradaretroalimentación de la fortaleza de la contraseñaHTMLCSSJavaScript
Abrir y ejecutar
0231Navegación y menús

panel de comandos de la base de conocimientos

Completa un panel de comandos en un contexto de base de conocimientos: incluye contenido real, controles interactivos, una clara retroalimentación de estado y un diseño adaptable a distintos tamaños.

Navegación y menúsPanel de comandosHTMLCSSJavaScript
Abrir y ejecutar
0232Superposición y retroalimentación de estado

Panel de ayuda del centro de tareas

Completa un panel flotante de ayuda para el contexto del centro de tareas: incluye contenido real, controles operables, retroalimentación de estado clara y diseño adaptable a varios tamaños.

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

Lista de contenido plegable para tareas de diseño

Completa una lista de contenido plegable en un escenario de tareas de diseño: incluye contenido real, controles interactivos, comentarios de estado claros y un diseño adaptable a distintos tamaños.

Tarjetas, listas y organización de contenidoLista de contenido plegableHTMLCSSJavaScript
Abrir y ejecutar
0234Tablas y visualización de datos

Control de visibilidad de columnas de calificaciones del curso

Control de la visibilidad de columnas en un contexto de calificaciones de curso: incluye contenido real, controles accionables, retroalimentación clara de estado y diseño adaptable a diferentes tamaños.

Tablas y visualización de datosControl de visualización de columnasHTML TableCSSJavaScript
Abrir y ejecutar
0235Diseño de página y responsive

Cubierta del panel de control del portal comunitario

En el escenario de un portal comunitario, completa la estructura del panel: incluye contenido real, controles interactivos, retroalimentación clara de estado y diseño adaptable a distintos tamaños.

Diseño de página y responsiveCarcasa del panelHTMLCSS GridResponsive Design
Abrir y ejecutar
0236Escenarios de páginas de marketing y contenido

Muro de historias de testimonios del festival creativo

Completa un muro de historias de testimonios en un escenario de festival creativo: incluye contenido real, controles interactivos, retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Escenarios de páginas de marketing y contenidoMuro de historias y testimoniosHTMLCSSJavaScript
Abrir y ejecutar
0237Interfaces de panel y administración

Centro de mando operativo de programación ambulatoria

Completa un panel de mando operativo para el contexto de programación ambulatoria: incluye contenido real, controles accionables, feedback de estado claro y diseño adaptable a distintos tamaños.

Interfaces de panel y administraciónCentro de mando de operacionesHTMLCSS GridJavaScript
Abrir y ejecutar
0238Procesos comerciales y de servicio

Flujo de reserva del servicio de alquiler de bicicletas

Crea un flujo de reserva de servicios en el contexto de alquiler de bicicletas: incluye contenido real, controles accionables, retroalimentación clara del estado y un diseño adaptable a distintos tamaños.

Procesos comerciales y de servicioFlujo de reserva de servicioHTMLCSSJavaScript
Abrir y ejecutar
0239Tipografía y efectos de texto

Diseño de capitular de revista urbana

Completa una composición con capitular para una revista urbana: incluye contenido realista, controles accionables, retroalimentación clara de estados y un diseño adaptable a distintos tamaños.

Tipografía y efectos de textoDiseño con capitularHTMLCSS GridResponsive Design
Abrir y ejecutar
0240Animación y microinteracciones

Transición del esqueleto de carga para herramienta de enfoque

Completa una transición de pantalla esqueleto en escenarios de herramientas de concentración: incluye contenido real, controles accionables, retroalimentación de estado clara y un diseño adaptable a distintos tamaños.

Animación y microinteraccionesTransición de pantalla esqueletoHTMLCSS AnimationJavaScript
Abrir y ejecutar