ion-card

shadow

カードは、テキスト、画像、ボタン、リストなどのコンテンツを表示するためのコンテナです。 カードは1つのコンポーネントで構成することもできますが、 多くの場合、ヘッダー、タイトル、サブタイトル、コンテンツで構成されます。 カードはこの構造に対応するため、いくつかのコンポーネントに分割されます。 カードヘッダ、カードタイトル、カードサブタイトル、カードコンテンツ。

基本的な使い方

Media Cards

Card Buttons

List Card

テーマ

Colors

CSSカスタムプロパティ

プロパティ

button

Description	trueの場合、ボタンタグがレンダリングされ、カードはタップ可能になる。
Attribute	button
Type	boolean
Default	false

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

disabled

Description	trueの場合、ユーザはカードと対話することができません。
Attribute	disabled
Type	boolean
Default	false

download

Description	この属性は、ブラウザが URL に移動する代わりに URL をダウンロードするように指示し、ユーザはローカルファイルとして保存するように促されます。この属性に値がある場合、保存のプロンプトであらかじめ入力されたファイル名として使用されます（ユーザーはファイル名を変更することができます）。
Attribute	download
Type	string ｜ undefined
Default	undefined

href

Description	ハイパーリンクが指し示す URL または URL フラグメントを格納します。このプロパティが設定されている場合、アンカータグがレンダリングされます。
Attribute	href
Type	string ｜ undefined
Default	undefined

mode

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

rel

Description	ターゲットオブジェクトとリンクオブジェクトの関係を指定します。値は、スペースで区切られたリンクタイプのリストです。
Attribute	rel
Type	string ｜ undefined
Default	undefined

routerAnimation

Description	ルータを使用する場合、hrefを使用して別のページに移動する際の遷移アニメーションを指定します。
Attribute	undefined
Type	((baseEl: any, opts?: any) => Animation) ｜ undefined
Default	undefined

routerDirection

Description	ルータを使用する場合、hrefを使用して他のページに移動する際の遷移方向を指定します。
Attribute	router-direction
Type	"back" ｜ "forward" ｜ "root"
Default	'forward'

target

Description	リンク先のURLを表示する場所を指定します。hrefを指定した場合のみ適用される。特別なキーワードがあります。_blank", "_self", "_parent", "_top".
Attribute	target
Type	string ｜ undefined
Default	undefined

type

Description	ボタンの種類。onclickまたはbutton`プロパティが存在する場合にのみ使用される。
Attribute	type
Type	"button" ｜ "reset" ｜ "submit"
Default	'button'

イベント

No events available for this component.

メソッド

No public methods available for this component.

CSS Shadow Parts

Name	Description
native	すべての子要素をラップするネイティブHTMLのボタン、アンカー、またはdiv要素です。

CSSカスタムプロパティ

Name	Description
--background	カードの背景
--color	カードの色

Slots

No slots available for this component.