hタグ
h2クラスh2クラス
h3クラスh3クラス
h4クラス
矢印アイコン
- bgColor、arrowColorを指定可能
- 指定しない場合は青背景に白い矢印のアイコンを表示
矢印アイコン付きリンク
アローアイコン付きテキストリンク
丸アイコンリンク
- テキストはhtml使用可能
- アイコン画像はパスを指定
よくある質問
マテリアルアイコン
リスト
- 番号付きリストの中に別の番号付きリストが入ることも考えられるため、数字は手打ちで対応
ドットリスト
- テキストが入ります。テキストが入ります。
- テキストが入ります。テキストが入ります。
テキストが入ります。テキストが入ります。
テキストが入ります。テキストが入ります。
番号付きリスト
- 1.テキストが入ります。テキストが入ります。
- 2.テキストが入ります。テキストが入ります。
テキストが入ります。テキストが入ります。
テキストが入ります。テキストが入ります。
- (1)テキストが入ります。テキストが入ります。
- (2)
テキストが入ります。テキストが入ります。
- ①テキストが入ります。テキストが入ります。
- ②テキストが入ります。テキストが入ります。 テキストが入ります。テキストが入ります。
- (3)テキストが入ります。テキストが入ります。
テキストが入ります。テキストが入ります。
- ア.
テキストが入ります。テキストが入ります。
- テキストが入ります。
- イ.テキストが入ります。テキストが入ります。
- テキストが入ります。
テキストが入ります。
- テキストが入ります。
- ア.
テキストが入ります。テキストが入ります。
注釈
- テキストが入ります。テキストが入ります。
- ※1テキストが入ります。テキストが入ります。
- ※2テキストが入ります。テキストが入ります。
テキストが入ります。テキストが入ります。
テーブル
- 列の長さを数値で指定する際は、該当ページのcssで調整
- 横幅を中身の文字に合わせる際はtableタグに"auto"クラスを指定
- スマホで横スクロール表示にする際は、tableタグを"table-scroll"クラスで囲む
- セルの色、文字の左寄せもcssで指定
| 預入期間 | 適用利率 |
|---|---|
| 6ヶ月未満 | スーパー定期3ヶ月ものの利率 |
| 6ヶ月以上 | スーパー定期6ヶ月ものの利率 |
| 項目 | 内容 | |
|---|---|---|
| テキストが入ります。 | テキストが入ります。 | 0000 |
| テキストが入ります。 | 0000 | |
| テキストが入ります。 | 0000 | |
| テキストが入ります。 | 0000 | |
- thタグのないテーブルは"headless"クラスを指定
| 商号 | 株式会社 沖縄海邦銀行 |
| 英語表記 | THE OKINAWA KAIHO BANK,LTD. |
本文内お問い合わせ
- itemsの要素分番号が表示されます。単独の番号の場合は要素を一つのみにしてください。
- descではhtmlが使用できます。
- desc、email、time、noteは空にすると非表示となります。
- ボタンを表示する場合はbuttonText、buttonUrlを指定してください。
- 〇〇に関するお問い合わせ
フリーダイヤル
FAX
〒900-8686
沖縄県那覇市久茂地2丁目9番12号
沖縄海邦銀行 リスク統括部
お客様サービス担当Eメール：customer@kaiho-bank.co.jp
受付時間平日 09:00～17:00
※ 但し、銀行休業日を除きます。
- 〇〇に関するお問い合わせ
フリーダイヤル
〒900-8686
沖縄県那覇市久茂地2丁目9番12号
沖縄海邦銀行 リスク統括部
お客様サービス担当受付時間平日 09:00～17:00
本文内お問い合わせ（よくあるご質問）
よくあるご質問お客さまから寄せられるご質問と、
それに対する回答をこちらでご確認いただけます。
店舗・ATM 検索店舗でのご相談・お問い合わせは、
ご希望の店舗にお気軽にご来店ください。
フレーム（POINT）
- 必要な数だけitemsの中身を複製して使用。
- 注釈がある場合はnoteに記述
- 最後の項目の末尾のカンマは不要です。
タイトルが入ります。111テキストが入ります。テキストが入ります。テキストが入ります。111
※注釈あり注釈あり注釈あり注釈あり注釈あり
- タイトルが入ります。222
テキストが入ります。テキストが入ります。テキストが入ります。222
- タイトルが入ります。333
テキストが入ります。テキストが入ります。テキストが入ります。333
フレーム（注意）
ご注意事項
テキストが入ります。
テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。
テキストが入ります。
カード
- ボタンを表示する場合は「buttonUrl」「buttonText」属性を指定
- カードのカラー指定は「borderColor」「bgColor」「arrowBgColor」で指定
- カラー指定を行わない場合はグレー枠線、白背景、青アイコンの組み合わせ
- 「clickableArea」にouterを指定すると、カード全体がクリッカブルになります
タイトルが入りますタイトルが入ります
タイトルが入りますタイトルが入ります
コピーが入ります。コピーが入ります。コピーが入ります。コピーが入ります。
タイトルが入りますタイトルが入ります
タイトルが入りますタイトルが入ります
コピーが入ります。コピーが入ります。コピーが入ります。コピーが入ります。
ページ内リンク
- 必要な数だけitemsの中身を複製して使用。
- elementにはスクロール先の要素のclassまたはidを指定
- offsetに画面上部からの距離を指定できます。値を指定しければ60pxが指定されます。
- 表示テキスト1
- 表示テキスト2
- 表示テキスト3
ドロップダウン
- コンテンツは通常のHTMLコーディング
- open属性にtrueを指定すると初期状態で開いた状態になります
- タイトルに「h3」のデザインを適用する場合は、style属性に「h3」を記述
- titleはhtmlが使用可能
htmlとしてレンダリングされます。タイトルが入ります1
コンテンツをHTMLコーディング
コンテンツをHTMLコーディング
タイトルが入ります2
コンテンツをHTMLコーディング
コンテンツをHTMLコーディング
タイトルが入ります3
コンテンツをHTMLコーディング
コンテンツをHTMLコーディング
大カテゴリー
よくある質問コンテンツ
よくある質問コンテンツ
プルダウン
- 「placeholder」に初期表示テキストを記述。
- 「name」はselect要素のname属性に使用
- 「items.text」はoptionのテキスト
- 「items.name」はoptionのname属性
- 「items.checked」にtrueを指定すると、その選択肢が初期状態でアクティブになります。
タブ
- タブに対応する要素に「data-content」属性で名前を付与
- Tabコンポーネントのtargetには対応する上記要素の名前を指定
- 初期状態で表示するタブコンテンツ以外の要素には「is-hidden」クラスを付与
- 初期状態でアクティブなタブはactiveで指定
- color属性でカラーリングを変更可能
- ページコンテンツ全体のタブとして使用する場合はtype="head"を付与
コース50
50ポイント以上
コース100
100ポイント以上
コース200
200ポイント以上
コース50コンテンツ
コース100コンテンツ
コース200コンテンツ
コース50
コース100
コース200
コース50コンテンツ
コース100コンテンツ
コース200コンテンツ
教育ローン
教育カードローン
コンテンツ1
コンテンツ2
モーダル
- Modalコンポーネントにidを指定
- モーダルを開く要素の「data-micromodal-trigger」属性に、該当モーダルのidを指定
