## Contenedor Componentes contenedores para iniciar una estructura básica de un sitio: ``: Contenedor. Cuando este elemento se anida con un `` o ``, todos los elementos secundarios se organizan verticalmente. De lo contrario, de forma horizontal. ``: Contenedor para cabeceras. ``: Contenedor para secciones laterales (generalmente, una barra lateral). ``: Contenedor para sección principal. ``: Contenedor para pie de página. :::tip Estos componentes utilizan flex para el diseño, así que asegúrate que el navegador lo soporte. Además, los elementos directos de `` tienen que ser uno o más de los últimos cuatro componentes. Y el elemento padre de los últimos cuatro componentes debe ser un ``. ::: ### Diseños comunes ::: demo ```html Cabecera Principal Cabecera Principal Pie de página Barra lateral Principal Cabecera Barra lateral Principal Cabecera Barra lateral Principal Pie de página Barra lateral Cabecera Principal Barra lateral Cabecera Principal Pie de página ``` ::: ### Ejemplo ::: demo ```html Option 1 Option 2 Option 3 Option 4-1 Option 1 Option 2 Option 3 Option 4-1 Option 1 Option 2 Option 3 Option 4-1 View Add Delete Tom ``` ::: ### Atributos de contenedor | Atributo | Descripción | Tipo | Valores aceptados | Por defecto | |---------- |-------------- |---------- |-------------------------------- |-------- | | direction | dirección de diseño para elementos secundarios | string | horizontal / vertical | vertical cuando el elemento está anidado con `el-header`, de lo contrario, horizontal | ### Atributos de cabecera | Atributo | Descripción | Tipo | Valores aceptados | Por defecto | |---------- |-------------- |---------- |-------------------------------- |-------- | | height | altura de la cabecera | string | — | 60px | ### Atributos de barra lateral | Atributo | Descripción | Tipo | Valores aceptados | Por defecto | |---------- |-------------- |---------- |-------------------------------- |-------- | | width | ancho de la barra lateral | string | — | 300px | ### Atributos de pie de página | Atributo | Descripción | Tipo | Valores aceptados | Por defecto | |---------- |-------------- |---------- |-------------------------------- |-------- | | height | altura del pie de página | string | — | 60px |