Container

Componentes contenedores para iniciar una estructura básica de una página:

<el-container>: contenedor envoltorio. Cuando se anidan con un <el-header> o <el-footer>, todos sus elementos hijos estarán dispuestos verticalmente. De lo contrario horizontalmente.

<el-header>: contenedor para encabezados.

<el-aside>: Contenedor para secciones laterales (generalmente, una barra lateral).

<el-main>: contenedor para secciones principales.

<el-footer>: contenedor para pie de página.

TIP

Estos componentes usan flex para el diseño, así que por favor asegúrese de que su navegador lo soporta. Además, los elementos secundarios directos de <el-container>tienen que ser uno o más de los últimos cuatro componentes. Y el elemento padre de estos últimos cuatro componentes debe ser un <el-container>.

Diseños comunes

Ejemplo

API del Contenedor

Atributos del contenedor

NombreDescripciónTipoPor defecto
directiondirección de diseño para elementos secundariosenumvertical when nested with el-header or el-footer; horizontal otherwise

Slots del contenedor

NombreDescripciónSubtags
defaultpersonaliza el contenido por defectoContainer / Header / Aside / Main / Footer

API de cabecera

Atributos de cabecera

NombreDescripciónTipoPor defecto
heightaltura del encabezadostring60px

Slots del encabezado

NombreDescripción
defaultpersonaliza el contenido por defecto

Aside API

Atributos de la sección lateral

NombreDescripciónTipoPor defecto
widthancho de la sección lateralstring300px

Slots de la sección lateral

NombreDescripción
defaultpersonaliza el contenido por defecto

Main API

Slots de la sección principal

NombreDescripción
defaultpersonaliza el contenido por defecto

Atributos de pie de página

NombreDescripciónTipoPor defecto
heightaltura del pie de páginastring60px

Slots del pie de página

NombreDescripción
defaultpersonaliza el contenido por defecto

Fuente

Componentes • Documentación

Contribuidores