Guía del usuario Cancelar

Añadir relleno a bloques de contenido y componentes en Adobe Captivate

  1. Guía del usuario de Captivate
  2. Introducción a Captivate
    1. Novedades de Adobe Captivate
    2. Requisitos del sistema de Adobe Captivate
    3. Actualizaciones de Adobe Captivate
      1. Notas de la versión de Adobe Captivate (actualización 12.4)
      2. Notas de la versión Adobe Captivate (actualización 12.3)
      3. Notas de la versión de Adobe Captivate (actualización 12.2)
      4. Notas de la versión Adobe Captivate (actualización 12.1)
    4. Descargar Adobe Captivate
    5. Preguntas más frecuentes
  3. Añadir una diapositiva
    1. Navegador de diapositivas en Adobe Captivate
    2. Añadir una diapositiva de conversación
    3. Añadir personajes al proyecto de Adobe Captivate
    4. Editar la imagen de fondo de una diapositiva
    5. Añadir relleno a bloques de contenido y componentes
    6. Crear un proyecto de desplazamiento largo
  4. Añadir bloques de texto
    1. Añadir texto a un proyecto
  5. Añadir bloques multimedia
    1. Añadir imágenes a un proyecto
    2. Añadir vídeos a un proyecto
    3. Añadir citas
    4. Añadir SVG a un proyecto
  6. Componentes interactivos
    1. Añadir un botón
    2. Añadir un campo de entrada
    3. Añadir un grupo de botones de opción
    4. Añadir un menú desplegable
    5. Añadir una casilla de verificación
  7. Widgets
    1. Añadir una tarjeta
    2. Añadir fichas
    3. Agregar un certificado
    4. Añadir un carrusel
    5. Añadir una zona interactiva
    6. Añadir arrastrar y soltar
    7. Añadir una cronología
    8. Añadir Pulsar para revelar
  8. Crear pruebas
    1. Añadir una pregunta de opción múltiple
    2. Añadir una pregunta de verdadero o falso
    3. Añadir una pregunta de asociar columnas
    4. Añadir una pregunta de respuesta corta
    5. Añadir una pregunta de secuencia
    6. Añadir grupos de preguntas y diapositivas de preguntas aleatorias
    7. Importación de preguntas como CSV
  9. Añadir audio a un proyecto
    1. Añadir audio
  10. Interacciones
    1. Añadir interacciones a un proyecto
    2. Crear un vídeo interactivo con superposición
    3. Crear una interacción de nivel de diapositiva
    4. Crear una interacción de nivel de objeto
  11. Animaciones
    1. Añadir animaciones a un proyecto
  12. Accesibilidad
    1. Hacer accesible un proyecto
  13. Personalizar la cronología
    1. Panel Cronología en Adobe Captivate
  14. Personalizar el índice y la barra de reproducción
    1. Índice en Adobe Captivate
  15. Editar las propiedades del proyecto
    1. Variables de Adobe Captivate
    2. Preferencias
    3. Dimensiones del proyecto
    4. Temas
  16. Crear un proyecto de simulación
    1. Simulación
  17. Vista previa de un proyecto
    1. Vista previa
  18. Compartir un proyecto para revisión
    1. Uso compartido para su revisión   
  19. Publicar un proyecto
    1. Publicar el proyecto
  20. Actualizar proyectos en Adobe Captivate
    1. Actualizar proyectos a la versión más reciente 

Información general

El relleno crea espacio entre el contenido y sus bordes, lo que mejora la disposición visual y la alineación del proyecto. Se puede aplicar en el nivel de los bloques de contenido o dentro de los componentes para ayudar a mejorar la alineación y el espaciado, lo que contribuye a una mejor experiencia de visualización.

Ventajas del relleno

  • Crea un espaciado uniforme alrededor de los elementos, lo que garantiza un aspecto limpio y profesional. 
  • Aumenta el espacio alrededor de los elementos interactivos, lo que facilita su selección y mejora la experiencia del usuario.

Cuándo utilizar el relleno: ळ

  • Ajuste el tamaño: si necesita aumentar el espacio alrededor de un elemento, considere la posibilidad de añadir o incrementar el relleno. Esto es especialmente útil para los elementos interactivos, donde el espacio adicional puede mejorar la accesibilidad. 
  • Espacio entre bordes: el relleno añade espacio entre el contenido y el borde, lo que puede ayudar a garantizar una mejor alineación con otros elementos de la página.

Temas de esta página:

Relleno de bloques de contenido

Añada relleno a todo un bloque de contenido desde los bordes y vea el comportamiento en diferentes ventanas. 

  1. Seleccione Propiedades visuales en la barra de herramientas derecha y expanda la sección Alineación y espaciado para ver los valores de relleno.

    Imagen que muestra cómo añadir relleno para un bloque de contenido
    Relleno de bloques de contenido

  2. Utilice el regulador Anchura del contenido para modificar el espaciado horizontal de cualquier bloque de contenido desde el lado izquierdo o derecho. Especifique el porcentaje de espaciado deseado con el regulador. A medida que ajuste el ancho, los valores de relleno se actualizarán automáticamente para reflejar los cambios.

  3. Active Diseño automático para ajustar la anchura del contenido proporcionalmente en todas las ventanas gráficas de los dispositivos o desactívelo para ajustarlas manualmente. Obtenga más información sobre los diseños automáticos para diferentes ventanas. 

    Si la función Diseño automática está desactivada, se pueden establecer valores de relleno para todos los lados y ajustar la anchura del contenido de cada ventana gráfica de forma independiente. Esto significa que puede añadir una anchura de contenido para una ventana sin que esto afecte a las demás. 

    Imagen que muestra el relleno de bloques de contenido para la vista de tableta con la opción Diseño automático desactivada
    Relleno de bloques de contenido para la vista de tableta con la opción Diseño automático desactivada

    Nota:

    El relleno horizontal de los bloques de contenido se establece en forma de porcentaje debido a que la anchura del proyecto es fija. El relleno vertical se define en píxeles para incluir contenido de desplazamiento largo.

Relleno de nivel de componente

Incorpore relleno para cada elemento dentro de un bloque de contenido, incluidas imágenes, texto, elementos interactivos, tarjetas y objetos de widget. El relleno de los componentes dentro de un bloque de contenido puede añadirse de dos formas:

Relleno uniforme: añada relleno a los cuatro lados simultáneamente.

Relleno no uniforme: añada relleno a cada lado individualmente. Esta opción se selecciona de forma predeterminada.

Esta es una imagen.

A continuación, se muestra un ejemplo de relleno uniforme de 50 px en los cuatro lados dentro del bloque de texto.

Esta es una imagen.

Al pasar el cursor sobre los bordes de cualquier componente, se muestran controles de color rosa que se pueden arrastrar para ajustar el espaciado. Para que el relleno sea uniforme en todos los lados, mantenga pulsada la tecla Mayús mientras arrastra los controles.

Esta es una imagen.

Ejemplos de relleno para diferentes componentes

A continuación, se muestran algunos ejemplos de relleno para varios componentes en un proyecto con una dimensión de 1366 x 768 px:

Añada relleno a cualquier bloque de texto para crear espacio entre el contenido y sus contornos. En cada componente de texto (título, subtítulo o cuerpo de texto), utilice los controles de color rosa para arrastrar e introducir el relleno directamente en el lienzo. También puede seleccionar el componente de texto e introducir los valores de relleno en la sección Alineación y espaciado de Propiedades visuales.

En el ejemplo se muestra cómo añadir relleno a un bloque de texto de varias columnas dentro del componente de cuerpo, en concreto, mediante la aplicación de un relleno de 100 px en la parte inferior.

Esta es una imagen.

Seleccione la imagen y arrastre los controles de color rosa situados cerca de los bordes de la imagen. También puede introducir valores de relleno en la sección Alineación y espaciado del menú Propiedades visuales.

En el ejemplo, se muestra un relleno inferior de 60 píxeles desde el contorno de un contenedor de imagen:

Esta es una imagen.

Puede añadir relleno a las imágenes de una cuadrícula de imágenes, dentro de widgets, tarjetas, caracteres e imágenes en diapositivas de preguntas, pero no a las imágenes de fondo.

Este es un ejemplo de cómo añadir relleno dentro de un componente de botón interactivo. Añada un componente de botón y seleccione el botón dentro de su bloque de contenido. Utilice los controles de color rosa para arrastrar y añadir espaciado o introduzca los valores de relleno en la sección Alineación y espaciado

Esta es una imagen.

Nota:

Los componentes interactivos Grupo de botones de opción y Lista desplegable no admiten relleno.

Añada relleno a cualquier componente dentro de un widget, como texto para encabezados, subtítulos, imágenes, tarjetas e iconos. En este ejemplo de widget de ficha, puede seleccionar cualquier componente dentro del widget y utilizar los controles de color rosa para ajustar el relleno.

O bien seleccione un componente y añada relleno desde Alineación y espaciado en Propiedades visuales. En este ejemplo, se añade un relleno de 30 px al icono de volteo dentro de la tarjeta. Del mismo modo, puede seleccionar cualquier texto o imagen dentro de cada tarjeta y añadir relleno a sus contornos.

Esta es una imagen.

Incorpore relleno en todos los componentes de las diapositivas de preguntas, incluidos el texto, las imágenes y los botones interactivos. La adición de espacios entre las opciones de las diapositivas de preguntas facilita la selección y mejora la estética general de la pregunta. Este es un ejemplo de pregunta de opción múltiple con relleno dentro de las opciones de imagen.

Esta es una imagen.

Diseños automáticos

Si la función Diseño automático está activada, el relleno se ajusta proporcionalmente a las ventanas de los dispositivos para los bloques de contenido y los componentes, con valores que responden a los equipos de sobremesa, tabletas y móviles en función de las dimensiones del proyecto. Obtenga más información sobre cómo cambiar las dimensiones del proyecto en Adobe Captivate.

Comportamiento de la función Diseño automático cuando está activada

Cuando la función Diseño automático está activada, el relleno se ajusta proporcionalmente en los distintos dispositivos, modificando automáticamente los valores de cada ventana. En un proyecto con una resolución de 1366 x 768 px, un relleno de 50 px en el escritorio se ajusta a 28 px en una tableta y a 16 px en un móvil sin alterar la relación de aspecto.

Imagen que muestra la vista de escritorio cuando se activa la función Diseño automático
Vista de escritorio con la función Diseño automático activada

Esta es una imagen.
Vista de tableta con la función Diseño automático activada

Esta es una imagen.
Vista de móvil (vertical) con la función Diseño automático activada

Comportamiento de la función Diseño automático cuando está desactivada

A continuación, se muestra un ejemplo en el que la función Diseño automático está desactivada para un tamaño de proyecto de 1366 x 768 px. En este caso, el usuario puede añadir manualmente los valores de relleno para cada puerto de visualización con el fin de obtener la mejor experiencia de visualización.

Vista de escritorio (relleno 50 px): 

Diseño automático desactivado para la vista de escritorio (relleno: 50 px)

Vista de tableta (el relleno ha cambiado manualmente a 10 px con la función Diseño automático desactivada): 

Esta es una imagen.

Vista de móvil (el relleno se ha cambiado manualmente a 20 px):

Esta es una imagen.

Obtén ayuda de forma más rápida y sencilla

¿Nuevo usuario?