Commit a23fbb70 authored by Javier Diaz's avatar Javier Diaz Committed by 杨奕

[Container] Spanish translation

parent 287b8239
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
color: #333; color: #333;
} }
#common-layouts + .demo-container { #disenos-comunes + .demo-container {
.el-header, .el-footer { .el-header, .el-footer {
text-align: center; text-align: center;
} }
...@@ -57,76 +57,78 @@ ...@@ -57,76 +57,78 @@
}; };
</script> </script>
## Container ## Contenedor
Container components for scaffolding basic structure of the page: Componentes contenedores para iniciar una estructura básica de un sitio:
`<el-container>`: wrapper container. When nested with a `<el-header>` or `<el-footer>`, all its child elements will be vertically arranged. Otherwise horizontally. `<el-container>`: Contenedor. Cuando este elemento se anida con un `<el-header>` o `<el-footer>`, todos los elementos secundarios se organizan verticalmente.
De lo contrario, de forma horizontal.
`<el-header>`: container for headers. `<el-header>`: Contenedor para cabeceras.
`<el-aside>`: container for side sections (usually a side nav). `<el-aside>`: Contenedor para secciones laterales (generalmente, una barra lateral).
`<el-main>`: container for main sections. `<el-main>`: Contenedor para sección principal.
`<el-footer>`: container for footers. `<el-footer>`: Contenedor para pie de página.
:::tip :::tip
These components use flex for layout, so please make sure your browser supports it. Besides, `<el-container>`'s direct child elements have to be one or more of the latter four components. And father element of the latter four components must be a `<el-container>`. Estos componentes utilizan flex para el diseño, así que asegúrate que el navegador lo soporte. Además, los elementos directos de `<el-container>` tienen que
ser uno o más de los últimos cuatro componentes. Y el elemento padre de los últimos cuatro componentes debe ser un `<el-container>`.
::: :::
### Common layouts ### Diseños comunes
::: demo ::: demo
```html ```html
<el-container> <el-container>
<el-header>Header</el-header> <el-header>Cabecera</el-header>
<el-main>Main</el-main> <el-main>Principal</el-main>
</el-container> </el-container>
<el-container> <el-container>
<el-header>Header</el-header> <el-header>Cabecera</el-header>
<el-main>Main</el-main> <el-main>Principal</el-main>
<el-footer>Footer</el-footer> <el-footer>Pie de página</el-footer>
</el-container> </el-container>
<el-container> <el-container>
<el-aside width="200px">Aside</el-aside> <el-aside width="200px">Barra lateral</el-aside>
<el-main>Main</el-main> <el-main>Principal</el-main>
</el-container> </el-container>
<el-container> <el-container>
<el-header>Header</el-header> <el-header>Cabecera</el-header>
<el-container> <el-container>
<el-aside width="200px">Aside</el-aside> <el-aside width="200px">Barra lateral</el-aside>
<el-main>Main</el-main> <el-main>Principal</el-main>
</el-container> </el-container>
</el-container> </el-container>
<el-container> <el-container>
<el-header>Header</el-header> <el-header>Cabecera</el-header>
<el-container> <el-container>
<el-aside width="200px">Aside</el-aside> <el-aside width="200px">Barra lateral</el-aside>
<el-container> <el-container>
<el-main>Main</el-main> <el-main>Principal</el-main>
<el-footer>Footer</el-footer> <el-footer>Pie de página</el-footer>
</el-container> </el-container>
</el-container> </el-container>
</el-container> </el-container>
<el-container> <el-container>
<el-aside width="200px">Aside</el-aside> <el-aside width="200px">Barra lateral</el-aside>
<el-container> <el-container>
<el-header>Header</el-header> <el-header>Cabecera</el-header>
<el-main>Main</el-main> <el-main>Principal</el-main>
</el-container> </el-container>
</el-container> </el-container>
<el-container> <el-container>
<el-aside width="200px">Aside</el-aside> <el-aside width="200px">Barra lateral</el-aside>
<el-container> <el-container>
<el-header>Header</el-header> <el-header>Cabecera</el-header>
<el-main>Main</el-main> <el-main>Principal</el-main>
<el-footer>Footer</el-footer> <el-footer>Pie de página</el-footer>
</el-container> </el-container>
</el-container> </el-container>
...@@ -168,7 +170,7 @@ These components use flex for layout, so please make sure your browser supports ...@@ -168,7 +170,7 @@ These components use flex for layout, so please make sure your browser supports
``` ```
::: :::
### Example ### Ejemplo
::: demo ::: demo
```html ```html
...@@ -278,22 +280,22 @@ These components use flex for layout, so please make sure your browser supports ...@@ -278,22 +280,22 @@ These components use flex for layout, so please make sure your browser supports
``` ```
::: :::
### Container Attributes ### Atributos de contenedor
| Attribute | Description | Type | Accepted Values | Default | | Atributo | Descripción | Tipo | Valores aceptados | Por defecto |
|---------- |-------------- |---------- |-------------------------------- |-------- | |---------- |-------------- |---------- |-------------------------------- |-------- |
| direction | layout direction for child elements | string | horizontal / vertical | vertical when nested with `el-header` or `el-footer`; horizontal otherwise | | 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 |
### Header Attributes ### Atributos de cabecera
| Attribute | Description | Type | Accepted Values | Default | | Atributo | Descripción | Tipo | Valores aceptados | Por defecto |
|---------- |-------------- |---------- |-------------------------------- |-------- | |---------- |-------------- |---------- |-------------------------------- |-------- |
| height | height of the header | string | — | 60px | | height | altura de la cabecera | string | — | 60px |
### Aside Attributes ### Atributos de barra lateral
| Attribute | Description | Type | Accepted Values | Default | | Atributo | Descripción | Tipo | Valores aceptados | Por defecto |
|---------- |-------------- |---------- |-------------------------------- |-------- | |---------- |-------------- |---------- |-------------------------------- |-------- |
| width | width of the side section | string | — | 300px | | width | ancho de la barra lateral | string | — | 300px |
### Footer Attributes ### Atributos de pie de página
| Attribute | Description | Type | Accepted Values | Default | | Atributo | Descripción | Tipo | Valores aceptados | Por defecto |
|---------- |-------------- |---------- |-------------------------------- |-------- | |---------- |-------------- |---------- |-------------------------------- |-------- |
| height | height of the footer | string | — | 60px | | height | altura del pie de página | string | — | 60px |
\ No newline at end of file \ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment