Fibonacci Flexbox Composer: herramienta cómoda que simplifica CSS Flexbox

la aplicación web Compositor de Fibonacci Flexbox por Max Steenbergen de los Países Bajos es de gran ayuda cuando se trata de ingresar a CSS Flexbox. Básicamente, no se necesita ningún conocimiento previo.

Flexbox: es necesario acostumbrarse a la división flexible de páginas

Aquí en Noupe, ya hemos tratado con Flexbox un par de veces. Si quiere aprender las cuerdas rápido y concentrado, eche un vistazo a este video curso gratuito. Para obtener el resultado deseado más rápido, diríjase a estos patrones de Flexbox.

Al final, no podemos negar que Flexbox lleva bastante tiempo acostumbrarse. Si desea comenzar sin tener mucho tiempo, necesita una herramienta visual que se encargue de la mayor parte de la codificación.

Fibonacci Flexbox Composer: estructuración visual de los diseños de Flexbox

Fibonacci Flexbox Composer de Steenbergen hace precisamente eso. Comienza con un div que llena toda la ventana gráfica de la ventana del navegador. Ahora, puede usar el mouse para dividir aún más este div. Esto solo toma unos pocos clics. Si desea definir aún más los subcontenedores individuales, puede recopilar datos para eso a la izquierda del editor. Como cada elemento dividido se puede dividir tanto horizontal como verticalmente, son posibles muchos diseños.

Una vez que haya hecho clic en su camino a un diseño, simplemente desplácese hacia abajo y podrá exportar el HTML y CSS necesarios para integrarlo en su propio proyecto. A partir de este punto, tiene sentido tener algunos conocimientos básicos. Después de todo, este código no está realmente hecho para hablar.

Fibonacci Flexbox Composer: vista previa de HTML

Sin embargo, con cierta meticulosidad, aún podrá ver a través de la estructura del código e integrar sus elementos de contenido en los lugares designados. Piense en el trabajo con el compositor como un buen punto de partida para aprender a usar CSS Flexbox.