ion-col
Properties
offset
| Description | オフセットする量を、利用可能な合計の末尾に何列分シフトさせるかで指定します。 |
| Attribute | offset |
| Type | string ｜ undefined |
| Default | undefined |
offsetLg
| Description | lgスクリーン用のカラムをオフセットする量を、使用可能な合計の末尾に何カラム分シフトさせるかで指定します。 |
| Attribute | offset-lg |
| Type | string ｜ undefined |
| Default | undefined |
offsetMd
| Description | mdスクリーン用のカラムをオフセットする量を、使用可能な合計の末尾に何カラム分シフトさせるかで指定します。 |
| Attribute | offset-md |
| Type | string ｜ undefined |
| Default | undefined |
offsetSm
| Description | smスクリーン用のカラムをオフセットする量を、利用可能な合計の末尾に何カラム分シフトさせるかで指定します。 |
| Attribute | offset-sm |
| Type | string ｜ undefined |
| Default | undefined |
offsetXl
| Description | xlスクリーン用のカラムをオフセットする量を、利用可能な合計の末尾に何カラム分シフトさせるかで指定します。 |
| Attribute | offset-xl |
| Type | string ｜ undefined |
| Default | undefined |
offsetXs
| Description | xsスクリーンのカラムをオフセットする量を、利用可能な合計の末尾に何カラム分ずらすかで指定します。 |
| Attribute | offset-xs |
| Type | string ｜ undefined |
| Default | undefined |
pull
| Description | 列を引っ張る量を、利用可能な合計の開始位置に何列分ずらすかで指定します。 |
| Attribute | pull |
| Type | string ｜ undefined |
| Default | undefined |
pullLg
| Description | lgスクリーン用のカラムを引く量を、使用可能な合計の開始位置に何カラム分シフトさせるかで指定します。 |
| Attribute | pull-lg |
| Type | string ｜ undefined |
| Default | undefined |
pullMd
| Description | mdスクリーン用のカラムを引っ張る量を、利用可能な合計の開始位置に何カラムシフトさせるかで指定します。 |
| Attribute | pull-md |
| Type | string ｜ undefined |
| Default | undefined |
pullSm
| Description | smスクリーン用のカラムを引っ張る量を、利用可能な合計の開始位置に何カラム分シフトさせるかで指定します。 |
| Attribute | pull-sm |
| Type | string ｜ undefined |
| Default | undefined |
pullXl
| Description | xlスクリーン用のカラムを引っ張る量を、利用可能な合計の開始位置に何カラム分シフトさせるかで指定します。 |
| Attribute | pull-xl |
| Type | string ｜ undefined |
| Default | undefined |
pullXs
| Description | xsスクリーン用のカラムを引っ張る量を、利用可能な合計の開始位置に何カラム分シフトさせるかで指定します。 |
| Attribute | pull-xs |
| Type | string ｜ undefined |
| Default | undefined |
push
| Description | カラムを押す量を、利用可能な合計の末尾に何カラム分シフトさせるかで指定します。 |
| Attribute | push |
| Type | string ｜ undefined |
| Default | undefined |
pushLg
| Description | lgスクリーン用のカラムをプッシュする量を、使用可能な総カラムのうち何カラム分までシフトさせるかで指定します。 |
| Attribute | push-lg |
| Type | string ｜ undefined |
| Default | undefined |
pushMd
| Description | mdスクリーン用のカラムを、利用可能な合計の末尾に何カラム分シフトさせるかを指定します。 |
| Attribute | push-md |
| Type | string ｜ undefined |
| Default | undefined |
pushSm
| Description | smスクリーン用のカラムを押す量を、使用可能な合計の末尾に何カラム分シフトさせるかで指定します。 |
| Attribute | push-sm |
| Type | string ｜ undefined |
| Default | undefined |
pushXl
| Description | xlスクリーン用のカラムをプッシュする量を、利用可能な合計の末尾にシフトするカラムの数で指定します。 |
| Attribute | push-xl |
| Type | string ｜ undefined |
| Default | undefined |
pushXs
| Description | xsスクリーン分の列を、利用可能な合計の末尾に何列分シフトさせるかを指定します。 |
| Attribute | push-xs |
| Type | string ｜ undefined |
| Default | undefined |
size
| Description | カラムの大きさを、利用可能なカラムのうち何カラムを占めるかで指定します。"auto"が渡された場合、カラムはそのコンテンツのサイズになります。 |
| Attribute | size |
| Type | string ｜ undefined |
| Default | undefined |
sizeLg
| Description | lgスクリーン用のカラムの大きさを、利用可能な合計カラム数のうち何カラムを占めるべきかという観点から指定します。 "auto"が渡された場合、カラムはそのコンテンツのサイズになります。 |
| Attribute | size-lg |
| Type | string ｜ undefined |
| Default | undefined |
sizeMd
| Description | mdスクリーンのカラムの大きさを、利用可能なカラムのうち何カラムを占有するかで指定します。"auto"が渡された場合、カラムはそのコンテンツのサイズになります。 |
| Attribute | size-md |
| Type | string ｜ undefined |
| Default | undefined |
sizeSm
| Description | smスクリーン用のカラムの大きさを、利用可能なカラムのうち何カラムを占めるかで指定します。"auto"が渡された場合、カラムはそのコンテンツのサイズになります。 |
| Attribute | size-sm |
| Type | string ｜ undefined |
| Default | undefined |
sizeXl
| Description | xlスクリーン用のカラムの大きさを、利用可能な合計カラムのうち何カラムを占めるべきかという観点から指定します。"auto"が渡された場合、カラムはそのコンテンツのサイズになります。 |
| Attribute | size-xl |
| Type | string ｜ undefined |
| Default | undefined |
sizeXs
| Description | xsスクリーンのカラムの大きさを、利用可能な合計のうち何カラムを占めるべきかという観点から指定します。 "auto"が渡された場合、カラムはそのコンテンツのサイズとなる。 |
| Attribute | size-xs |
| Type | string ｜ undefined |
| Default | undefined |
CSS Custom Properties
| Name | Description |
|---|---|
--ion-grid-column-padding | カラムのPadding |
--ion-grid-column-padding-lg | lg以上の画面でのコラムのPadding |
--ion-grid-column-padding-md | mdスクリーン以上のカラムのPadding |
--ion-grid-column-padding-sm | スマートフォン以上の画面では、コラムにパッドを入れる。 |
--ion-grid-column-padding-xl | xl以上の画面でのカラムのPadding |
--ion-grid-column-padding-xs | xsスクリーン以上のカラムのPadding |
--ion-grid-columns | グリッドのカラムの総数 |