header-logo
Crea tu sitio web y haz crecer tu negocio con Wix
Crea y gestiona tu sitio con las funciones intuitivas de Wix
Gestiona suscripciones, planes y facturas
Gestiona tu negocio y conecta con los miembros
Aprende a comprar, conectar o transferir un dominio
Herramientas para ampliar tu negocio y tu presencia online
Herramientas de marketing y SEO para impulsar tu negocio
Funciones avanzadas para trabajar de forma eficaz
Soluciones, problemas conocidos y contacto
placeholder-preview-image
Mejora tus habilidades con nuestros cursos y tutoriales.
Obtén consejos para diseño web, marketing y mucho más.
Mejora el tráfico orgánico en buscadores.
Crea un sitio con nuestra plataforma full-stack.
Vincúlate con un especialista que te ayude a alcanzar tus objetivos
placeholder-preview-image

Editor de Wix Studio: apilar elementos

6 min
En este artículo
  • Aplicar una pila
  • Cambiar la dirección de la pila
  • Administrar una pila
  • Ajustar el diseño de una pila
  • Ajustar el estilo de la pila
Una pila es un contenedor flexible que "abraza" un grupo de elementos, ya sea en orden vertical u horizontal. Garantiza que los elementos permanezcan en orden, con el espaciado que definas, y que nunca se superpongan. 
Dicho esto, puedes usar márgenes negativos para hacer que los elementos se superpongan de manera intencional.
¿Estás tratando con elementos superpuestos?
Echa un vistazo a nuestro video de solución de problemas (contenido en inglés) para obtener más información sobre qué verificar y cómo resolver este problema.

Aplicar una pila

Apilar elementos es una forma rápida de organizar el diseño con un espaciado uniforme, creando un estilo limpio y pulido. Al seleccionar varios elementos que están uno junto al otro (en el mismo elemento principal), aparece la opción de apilarlos. 

Para aplicar una pila:

  1. Ve al editor.
  2. Haz clic en el elemento que quieras que esté en la pila.
  3. Mantén presionada la tecla Shift y selecciona los otros elementos de la pila.
  4. Haz clic en Apilar.
  5. (Opcional) Arrastra la línea entre los elementos para establecer los márgenes.
Arrastrar los espacios entre los elementos de la pila para aumentar los márgenes
Consejo:
También puedes crear márgenes negativos para que los elementos se superpongan intencionalmente. 
Arrastrar los márgenes de la pila en la dirección opuesta para crear una superposición entre la imagen y el texto

Cambiar la dirección de la pila

Cuando apilas elementos, la dirección se determina automáticamente por el orden de los elementos. Si los elementos están dispuestos verticalmente, por ejemplo, la pila será vertical. 
De todos modos, siempre puedes cambiar la dirección usando el menú desplegable. Esto reorganiza automáticamente los elementos para que estén en el orden correcto. 
Un ejemplo de una pila horizontal convertida en vertical, los elementos ahora están en orden vertical

Administrar una pila

Puedes personalizar la pila para que coincida con el nuevo contenido y los nuevos requisitos. Agrega más elementos a la pila, muévelos con un solo clic y separa los elementos que ya no necesitas. 

Para administrar una pila:

  1. Ve al editor.
  2. Selecciona la pila correspondiente.
  3. Elige qué hacer a continuación:

Ajustar el diseño de una pila

No es necesario que la pila sea transparente; puedes diseñarla para que el contenido se destaque en la página. Agrega un color de fondo, un borde y una sombra. También puedes hacer que las esquinas de la pila sean más redondas o angulosas. 

Para diseñar una pila:

  1. Ve al editor.
  2. Selecciona la pila correspondiente.
  3. Haz clic en el icono Abrir Inspector profesional  en la parte superior derecha del editor.
Captura de pantalla del panel Inspector profesional abriéndose en el Editor de Wix Studio.
  1. Usa las opciones disponibles en Diseño para personalizar la pila:
    • Establece el color del relleno y su opacidad.
    • Agrega un borde para enmarcar la pila. 
    • Elige un radio para las esquinas.
    • Habilita el sombreado y administra ajustes como el ángulo, la distancia, el tamaño, etc.
Captura de pantalla del panel de inspección y una pila seleccionada en el lienzo, que muestra las opciones de diseño

Ajustar el estilo de la pila

Ajusta el estilo de la pila para asegurarte de que cada elemento tenga un espaciado, una alineación y un relleno de manera que se adapte a tu visión creativa o a las necesidades del cliente. 

Para ajustar el estilo de la pila:

  1. Ve al editor.
  2. Selecciona la pila correspondiente.
  3. Haz clic en el icono Abrir Inspector profesional  en la parte superior derecha del editor.
Captura de pantalla del panel Inspector profesional abriéndose en el Editor de Wix Studio.
  1. Desplázate hacia abajo hasta Estilo.
  2. Usa las opciones disponibles para ajustar el estilo de la pila:
    • Cambia la dirección de Horizontal a Vertical o viceversa.
    • Ingresa un valor en Espaciado de elementos para crear márgenes iguales entre los elementos de la pila (es decir, los ítems).
    • Elige una alineación para los elementos de la pila: Izquierda, Derecha, Centro o Justificar.
    • Agrega relleno a los lados. 
Una pila en el lienzo junto al panel Inspector profesional, que resalta la sección de estilo
¿Sabías lo siguiente?
Puedes ajustar el relleno y el espaciado directamente en el lienzo. Arrastra la línea entre los elementos o haz doble clic en la línea si prefieres ingresar un valor preciso. Incluso puedes cambiar la unidad de tamaño si es necesario.