Conoce sobre qué es Flexbox

Con una página web

¿Qué es Flexbox?

1¿Cómo funciona el flexbox en CSS?

Flexbox se basa en un contenedor flexible (flex container), que a su vez contiene varios elementos flexibles (flex items). El contenedor otorga sus propiedades a los elementos, es decir: los elementos o flexboxes deben su flexibilidad al hecho de estar dentro del contenedor.

2Particularidades

Con flexbox podemos permitir que la parte del objeto multimedia que contiene la imagen tome su información de tamaño de la imagen, y luego el cuerpo del objeto multimedia se flexione para ocupar el espacio restante. Cuando trabajamos con flexbox necesitamos pensar en términos de dos ejes — el eje principal y el eje cruzado. El eje principal está definido por la propiedad flex-direction, y el eje cruzado es perpendicular a este. Todo lo que hacemos con flexbox está referido a estos dos ejes, por lo que vale la pena entender cómo trabajan desde el principio. Cuando trabajamos con flexbox necesitamos pensar en términos de dos ejes — el eje principal y el eje cruzado. El eje principal está definido por la propiedad flex-direction, y el eje cruzado es perpendicular a este. Todo lo que hacemos con flexbox está referido a estos dos ejes, por lo que vale la pena entender cómo trabajan desde el principio.

Diseño Responsive

Es una filosofía de diseño y desarrollo cuyo objetivo es adaptar la apariencia de las páginas web al dispositivo que se esté utilizando para visitarlas. Hoy día las páginas web se ven en multitud de dispositivos como tabletas, teléfonos inteligentes, libros electrónicos, portátiles, PC, etcétera. Además, aun dentro de cada tipo, cada dispositivo tiene sus características concretas: tamaño de pantalla, resolución, potencia de CPU, sistema operativo o capacidad de memoria entre otras. Esta tecnología pretende que con un único diseño web, todo se vea correctamente en cualquier dispositivo.

Conoce más