メインコンテンツへスキップ
バージョン: v8

ion-badge

シャドウ

バッジは、通常別の要素の近くに表示されるインラインブロック要素です。通常、数字やその他の文字が含まれます。これらは、要素に関連付けられた追加のアイテムがあることを通知し、アイテムの数を示すために使用できます。コンテンツが渡されない場合、バッジは非表示になります。

基本的な使い方

テーマ

CSSプロパティ

プロパティ

color

説明アプリケーションのカラーパレットから使用する色。デフォルトのオプションは、"primary""secondary""tertiary""success""warning""danger""light""medium"、および"dark"です。色の詳細については、テーマを参照してください。
属性color
タイプ"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string | undefined
デフォルトundefined

mode

説明モードは、どのプラットフォームスタイルを使用するかを決定します。
属性mode
タイプ"ios" | "md"
デフォルトundefined

イベント

このコンポーネントで利用可能なイベントはありません。

メソッド

このコンポーネントで使用できる公開メソッドはありません。

CSSシャドウパーツ

このコンポーネントで使用できるCSSシャドウパーツはありません。

CSSカスタムプロパティ

名前説明
--backgroundバッジの背景
--colorバッジのテキスト色
--padding-bottomバッジの下部のパディング
--padding-end方向が左から右の場合は右のパディング、方向が右から左の場合はバッジの左のパディング
--padding-start方向が左から右の場合は左のパディング、方向が右から左の場合はバッジの右のパディング
--padding-topバッジの上部のパディング

スロット

このコンポーネントで利用可能なスロットはありません。