El Box Model en WebSite X5

Profundización >

El Box Model en WebSite X5

Previous pageReturn to chapter overviewNext page

En WebSite X5 las Páginas son creadas con la ayuda de una Rejilla y la maquetación puede perfeccionarse modificando los márgenes de los Objetos contenidos en las Celdillas, modificables mediante las opciones disponibles en la ventana Márgenes y Alineación que se abre con el botón Márgenes presente en la barra de herramientas del Paso 4 - Creación de la página.

Para comprender mejor qué se entiende por margen y lograr ajustar con precisión la maquetación de los contenidos es necesario comprender el Box Model utilizado.

Cando se escribe el código de una pgina web, todos los elementos HTML son considerados como bloques (o boxes) y a todo el conjunto de reglas que gestionan el aspecto visual de dichos elementos bloque se lo conoce como Box Model. Cada box comprende un cierto número de componentes de base, y cada uno se puede modificar con propiedades de las CSS: márgenes, bordes, espaciados y contenido.

La imagen siguiente ilustra las partes del Box Model:

Pulsar para expandir/reducir

En WebSite X5 la rejilla de maquetación en la que se trabaja identifica una serie de celdas en las que insertar los diferentes Objetos. Para ser más exactos, cada Objeto se inserta en un contenedor que a su vez está incluido dentro de una Celda de la Rejilla de maquetación. Para cada celda se aplica el Box Model de la imagen.

Por lo tanto los elementos son:

Contenido (área en verde): es el contenido añadido mediante el arrastre de uno de los objetos disponibles.
Margen interno (área de color fucsia): es el espacio entre el Objeto actual y el borde de su contenedor.
Borde: es el borde del contenedor del Objeto, el aspecto del borde se puede configurar con las opciones de la ventana Estilo del Objeto.
Margen externo (área de color naranja): es el espacio entre el borde del contenedor del Objeto y los bordes de la Rejilla de maquetación.

Teniendo encuenta estas definiciones, el espacio entre dos objetos situados uno junto a otro (en horizontal o en vertical) es igual a la suma de los márgenes externos especificados para las celdas que los contienen.