ion-col
Columnは
詳しくは
Column Alignment
By default, columns will stretch to fill the entire height of the row. Columns are
flex items, so there are several
プロパティ
offset | |
|---|---|
| Description | The amount to offset the column, in terms of how many columns it should shift to the end of the total available. |
| Attribute | offset |
| Type | string | undefined |
offsetLg | |
| Description | The amount to offset the column for lg screens, in terms of how many columns it should shift to the end of the total available. |
| Attribute | offset-lg |
| Type | string | undefined |
offsetMd | |
| Description | The amount to offset the column for md screens, in terms of how many columns it should shift to the end of the total available. |
| Attribute | offset-md |
| Type | string | undefined |
offsetSm | |
| Description | The amount to offset the column for sm screens, in terms of how many columns it should shift to the end of the total available. |
| Attribute | offset-sm |
| Type | string | undefined |
offsetXl | |
| Description | The amount to offset the column for xl screens, in terms of how many columns it should shift to the end of the total available. |
| Attribute | offset-xl |
| Type | string | undefined |
offsetXs | |
| Description | The amount to offset the column for xs screens, in terms of how many columns it should shift to the end of the total available. |
| Attribute | offset-xs |
| Type | string | undefined |
pull | |
| Description | The amount to pull the column, in terms of how many columns it should shift to the start of the total available. |
| Attribute | pull |
| Type | string | undefined |
pullLg | |
| Description | The amount to pull the column for lg screens, in terms of how many columns it should shift to the start of the total available. |
| Attribute | pull-lg |
| Type | string | undefined |
pullMd | |
| Description | The amount to pull the column for md screens, in terms of how many columns it should shift to the start of the total available. |
| Attribute | pull-md |
| Type | string | undefined |
pullSm | |
| Description | The amount to pull the column for sm screens, in terms of how many columns it should shift to the start of the total available. |
| Attribute | pull-sm |
| Type | string | undefined |
pullXl | |
| Description | The amount to pull the column for xl screens, in terms of how many columns it should shift to the start of the total available. |
| Attribute | pull-xl |
| Type | string | undefined |
pullXs | |
| Description | The amount to pull the column for xs screens, in terms of how many columns it should shift to the start of the total available. |
| Attribute | pull-xs |
| Type | string | undefined |
push | |
| Description | The amount to push the column, in terms of how many columns it should shift to the end of the total available. |
| Attribute | push |
| Type | string | undefined |
pushLg | |
| Description | The amount to push the column for lg screens, in terms of how many columns it should shift to the end of the total available. |
| Attribute | push-lg |
| Type | string | undefined |
pushMd | |
| Description | The amount to push the column for md screens, in terms of how many columns it should shift to the end of the total available. |
| Attribute | push-md |
| Type | string | undefined |
pushSm | |
| Description | The amount to push the column for sm screens, in terms of how many columns it should shift to the end of the total available. |
| Attribute | push-sm |
| Type | string | undefined |
pushXl | |
| Description | The amount to push the column for xl screens, in terms of how many columns it should shift to the end of the total available. |
| Attribute | push-xl |
| Type | string | undefined |
pushXs | |
| Description | The amount to push the column for xs screens, in terms of how many columns it should shift to the end of the total available. |
| Attribute | push-xs |
| Type | string | undefined |
size | |
| Description | The size of the column, in terms of how many columns it should take up out of the total
available. If
|
| Attribute | size |
| Type | string | undefined |
sizeLg | |
| Description | The size of the column for lg screens, in terms of how many columns it should take up out
of the total available. If
|
| Attribute | size-lg |
| Type | string | undefined |
sizeMd | |
| Description | The size of the column for md screens, in terms of how many columns it should take up out
of the total available. If
|
| Attribute | size-md |
| Type | string | undefined |
sizeSm | |
| Description | The size of the column for sm screens, in terms of how many columns it should take up out
of the total available. If
|
| Attribute | size-sm |
| Type | string | undefined |
sizeXl | |
| Description | The size of the column for xl screens, in terms of how many columns it should take up out
of the total available. If
|
| Attribute | size-xl |
| Type | string | undefined |
sizeXs | |
| Description | The size of the column for xs screens, in terms of how many columns it should take up out
of the total available. If
|
| Attribute | size-xs |
| Type | string | undefined |
CSSカスタムプロパティ
| Name | Description |
|---|---|
--ion-grid-column-padding | Padding for the Column |
--ion-grid-column-padding-lg | Padding for the Column on lg screens and up |
--ion-grid-column-padding-md | Padding for the Column on md screens and up |
--ion-grid-column-padding-sm | Padding for the Column on sm screens and up |
--ion-grid-column-padding-xl | Padding for the Column on xl screens and up |
--ion-grid-column-padding-xs | Padding for the Column on xs screens and up |
--ion-grid-columns | The number of total Columns in the Grid |