ons-icon - Onsen UI

Icons

Icons are displayed using the Icon component. In Onsen UI there are three families of icons available:

The icon is selected using the icon prop. To use Material Icons the md- prefix is used, ion- for Ionicons and fa- for Font Awesome.

<Icon icon='md-menu' />

The code above displays a Material Design menu icon.

[編集]

名前	型 / デフォルト値	概要
icon	String	The icon name. `"md-"` prefix for Material Icons, `"fa-"` for Font Awesome and `"ion-"` prefix for Ionicons. See all available icons on the element description (at the top). Icons can also be styled based on modifier presence. Add comma-separated icons with `"modifierName:"` prefix. The code `<ons-icon icon="ion-edit, material:md-edit"></ons-icon>` will display `"md-edit"` for Material Design and `"ion-edit"` as the default icon. `fa-` prefix is added automatically if none is provided. Check See also section for more information. （翻訳中） Optional.
size	String	The sizes of the icon. Valid values are lg, 2x, 3x, 4x, 5x, or in the size in pixels. Icons can also be styled based on modifier presence. Add comma-separated icons with `"modifierName:"` prefix. The code: `<ons-icon icon="ion-edit" size="32px, material:24px"> </ons-icon>` will render as a `24px` icon if the `"material"` modifier is present and `32px` otherwise. （翻訳中） Optional.
rotate	Number	アイコンを回転して表示します。90, 180, 270から指定できます。 Optional.
fixed-width	Boolean false	When used in a list, you want the icons to have the same width so that they align vertically by defining this attribute. （翻訳中） Optional.
spin		アイコンを回転するかどうかを指定します。 Optional.

名前	概要
fixedWidth	When used in a list, you want the icons to have the same width so that they align vertically by defining this attribute. （翻訳中）
spin	アイコンを回転するかどうかを指定します。

名前

概要

fixedWidth

When used in a list, you want the icons to have the same width so that they align vertically by defining this attribute. （翻訳中）

spin

アイコンを回転するかどうかを指定します。