Friki Work

La manipulación de imágenes mediante gestos de zoom, desplazamiento y escalado es una funcionalidad fundamental en el desarrollo de Mini Programas (como WeChat Mini Programs). A continuación, se presentan diversas estrategias técnicas para implementar estos efectos, desde soluciones nativas simples hasta interacciones complejas con gestos. 1. E ...

Introducción En los navegadores actuales, es común encontrar propiedades como esta: elemento { --color-fondo-principal: marrón; } A continuación, explicaremos detalladamente este concepto y proporcionaremos información relevante sobre su funcionamiento. Descripción general Las propiedades personalizadas (también conocidas como variables CS ...

El desarrollo web moderno exige una adaptabilidad impecable a diversos tamaños de pantalla. Para lograrlo, las conusltas de medios (media queries) son fundamentales. Este artículo explora una implementación avanzada en SCSS que simplifica la gestión de la lógica responsiva, permitiendo aplicar estilos condicionales tanto mediante las propias co ...

Al desarrollar proyectos con Vite, es común que todos los recursos compilados se agrupen en un único directorio dist/assets por defecto, lo que puede dificultar la gestión de archivos a gran escala. Este artículo explora cómo configurar Vite para organizar la estructura de directorios de los activos generados, separando archivos JavaScript, CSS ...

El desarrollo de interfaces de usuario (UI) es fundamental en la creación de aplicaciones web modernas. Una interfaz bien diseñada no solo mejora la experiencia del usuario, sino que también impacta directamente en el éxito de un producto. Ejemplo Práctico de Desarrollo de UI Implementación de un Grupo de Botones de Radio Al desarrollar listas ...

Márgenes negativos y diseño con floats 1.1 Márgenes negativos Al aplicar un margen negativo a un elemento, su posición en el flujo del documento se desplaza, pero a diferencia de position: relative, el espacio que ocupaba originalmente se libera. Esto permite que elementos posteriores en el flujo ocupen ese espacio. Es importante recordar qu ...

El modelo de caja flexible, comúnmente conocido como Flexbox, es un estándar de diseño unidimensional en CSS que permite distribuir el espacio entre los elementos de una interfaz y mejorar sus capacidades de alineación, incluso cuando el tamaño de los elementos es dinámico o desconocido. Fundamentos del Contenedor Flex Para activar este modelo, ...

La integración de la fuente PingFangSC en entornos heterogéneos requiere una gestión cuidadosa de formatos y estilos para asegurar una apariencia uniforme. A continuación, se detalla una metodología práctica basada en formatos complementarios y estrategias de carga optimizada. Formatos de fuente y su aplicación TTF (TrueType): Este formato gara ...

Optimizando CSS con Mixins de Sass: 10 Estrategias de Reutilización de Código Los mixins de Sass son una herramienta fundamental para la construcción de hojas de estilo eficientes, modulares y fáciles de mantener. Permiten encapsular bloques de estilos que pueden ser reutilizados en múltiples selectores, promoviendo el principio DRY (Don't Repe ...

El patrón de interfaz de usuario que permite deslizar un elemento de una lista horizontalmente para revelar botones de acción es una característica común en muchas aplicaciones móviles, como clientes de correo electrónico o aplicaciones de mensajería. Este enfoque mejora la experiencia del usuario al proporcionar acceso rápido a funcionalidades ...