Tabla
El propósito de este componente es organizar, presentar y visualizar datos estructurados de manera clara y comprensible. Las tablas son ampliamente utilizadas para mostrar información que se organiza en filas y columnas.
FRG_Tabla
Fragmento > Componentes - Contenido > FRG_Tabla
Este componente gracias a sus configuraciones nos ofrece tres tipos de diseño y a su vez podremos montar la tabla a nuestro gusto, como definir el número de filas o columnas que necesitamos o incluso anidar columnas o agrupar títulos de columnas, estas dos últimas opciones estan solo disponibles para el diseño de tabla XL.
Variantes
A continuación mostramos sus variantes.
Tabla M
Para este ejemplo se ha utilizado un color gris azulado de fondo para poder apreciar los margenes de la tabla en su versión móvil
|
Título de la tabla
|
Col-A | Col-B |
|---|---|---|
| Row-A | Row-A Col-A | Row-A Col-B |
| Row-B | Row-B Col-A | Row-B Col-B |
| Row-C | Row-C Col-A | Row-C Col-B |
| Footer | Total A | Total B |
| Row-A | |
|---|---|
| Col-A | Row-A Col-A |
| Col-B | Row-A Col-B |
| Row-B | |
| Col-A | Row-B Col-A |
| Col-B | Row-B Col-B |
| Row-C | |
| Col-A | Row-C Col-A |
| Col-B | Row-C Col-B |
| Footer | |
| Col-A | Total A |
| Col-B | Total B |
Tabla L
Para este ejemplo se ha utilizado un color gris azulado de fondo para poder apreciar los margenes de la tabla en su versión móvil
| Nombre de la columna | Col-A | Col-B |
|---|---|---|
| Row-A | Row-A Col-A | Row-A Col-B |
| Row-B | Row-B Col-A | Row-B Col-B |
| Row-C | Row-C Col-A | Row-C Col-B |
| Nombre de la columna | Row-A |
|---|---|
| Col-A | Row-A Col-A |
| Col-B | Row-A Col-B |
| Nombre de la columna | Row-B |
| Col-A | Row-B Col-A |
| Col-B | Row-B Col-B |
| Nombre de la columna | Row-C |
| Col-A | Row-C Col-A |
| Col-B | Row-C Col-B |
Tabla XL
Para este ejemplo se ha utilizado un color gris azulado de fondo para poder apreciar los margenes de la tabla en su versión móvil
|
TITULAR DE AGRUPACIÓN DE VARIAS COLUMNAS
|
TITULAR DE AGRUPACIÓN DE VARIAS COLUMNAS
|
||||||||
|---|---|---|---|---|---|---|---|---|---|
| Nombre de columna | Nombre de columna de más de dos líneas de extensión | Nombre de columna de dos líneas | Nombre de columna | Nombre de columna de más de dos líneas de extensión | Nombre de columna | Nombre de columna de más de dos líneas de extensión | Nombre de columna de más de dos líneas de extensión | Nombre de columna de dos líneas | Nombre de columna |
| Nombre fila | valor | valor | valor | valor | valor | valor | valor | valor | valor |
| valor | valor | valor | valor | valor | valor | valor | valor | valor | |
| Nombre fila | valor | valor | valor | valor | valor | valor | valor | valor | valor |
| valor | valor | valor | valor | valor | valor | valor | valor | valor | |
| valor | valor | valor | valor | valor | valor | valor | valor | valor | |
| valor | valor | valor | valor | valor | valor | valor | valor | valor | |
|
Parrafo explicativo del pie de tabla
|
|||||||||