ion-note

shadow

Noteは、一般的に詳細情報を提供するサブタイトルとして使用されるテキスト要素です。デフォルトではグレーで表示されるように設計されています。Noteは、メタデータテキストとしてアイテム内で使用することができます。

基本的な使い方

<ion-note>Default Note</ion-note>

Item Notes

<ion-item>
  <ion-label>Label</ion-label>
  <ion-note slot="end">Note (End)</ion-note>
</ion-item>

<ion-item>
  <ion-note slot="start">Note (Start)</ion-note>
  <ion-label>Label</ion-label>
</ion-item>

テーマ

Colors

<ion-note>Default Note</ion-note>
<ion-note color="primary">Primary Note</ion-note>
<ion-note color="secondary">Secondary Note</ion-note>
<ion-note color="tertiary">Tertiary Note</ion-note>
<ion-note color="success">Success Note</ion-note>
<ion-note color="warning">Warning Note</ion-note>
<ion-note color="danger">Danger Note</ion-note>
<ion-note color="light">Light Note</ion-note>
<ion-note color="medium">Medium Note</ion-note>
<ion-note color="dark">Dark Note</ion-note>

CSSカスタムプロパティ

src/app/example.component.css

ion-note {
  --color: #54dc98;
}

src/app/example.component.html

<ion-note>Default Note</ion-note>

プロパティ

color

Description	アプリケーションのカラーパレットから使用する色を指定します。デフォルトのオプションは以下の通りです。 "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", と "dark" です．色に関する詳しい情報は theming を参照してください。
Attribute	color
Type	"danger" ｜ "dark" ｜ "light" ｜ "medium" ｜ "primary" ｜ "secondary" ｜ "success" ｜ "tertiary" ｜ "warning" ｜ string ｜ undefined
Default	undefined

mode

Description	modeは、どのプラットフォームのスタイルを使用するかを決定します。
Attribute	mode
Type	"ios" ｜ "md"
Default	undefined

イベント

No events available for this component.

メソッド

No public methods available for this component.

CSS Shadow Parts

No CSS shadow parts available for this component.

CSSカスタムプロパティ

Name	Description
--color	ノートの色

Slots

No slots available for this component.