• ダウンロード
  • ブログ
  • デモ
  • Menu
  • home
  • >
  • ショートコード +α
  • >
  • アコーディオン(accordion)

アコーディオン(accordion)

Create a list of items that can be shown individually by clicking an item's header.

開いたり、閉じたりするメニューによって、情報をコンパクトに表示することができます。

使い方

=== を区切り線として使います。区切られた、それぞれの内容の一行目を「アコーディオンのタイトル」として使います。

  • Preview
  • Shortcode
    • アコーディオンタイトル1

      ここがアコーディオン1の文章、コンテンツを入れる場所です。自由に入れてください。

    • アコーディオンタイトル2

      Here is the content of Accordion2. You can write freely.

    • アコーディオンタイトル3
      重要 区切り線は、単独で 3つの = で作る ようにしてください。

  • [uk-accordion]
    アコーディオンタイトル1
    
    ここがアコーディオン1の文章、コンテンツを入れる場所です。自由に入れてください。
    
    ===
    
    アコーディオンタイトル2
    
    Here is the content of Accordion2. You can write freely.
    
    ===
    
    アコーディオンタイトル3
    
    [uk-label]重要[/uk-label] 区切り線は、単独で 3つの = で作る ようにしてください。
    
    
    [/uk-accordion]
    

詳細

オプション デフォルト 説明
multiple — true が選べます。trueを設定すると、アコーディオンを開いたままにします
| オプション | デフォルト | 説明 |
|:–|:–|:–|
| multiple | — | true が選べます。trueを設定すると、アコーディオンを開いたままにします |

` class=”uk-table uk-table-striped”`


ヒント

シンプルに使いましょう。

  • UIKitの は、 https://getuikit.com/docs/accordion

アラート(alert) >
< 投稿表示 (kns-showpost)

ショートコード +α

ショートコード、HTML、CSS、uikit

  • ショートコードとは
  • UIKit を知って活用する
  • 投稿表示 (kns-showpost)
  • アコーディオン(accordion)
  • アラート(alert)
  • バッジ (badge)
  • ボタン(button)
  • グリッド(grid)
  • アイコン (icon)
  • ラベル (label)
  • ライトボックス(lightbox)
  • スライドショー (slideshow)
  • タブ (tab)

Copyright © toiee Lab, All rights reserved.

ショートコード +α

ショートコード、HTML、CSS、uikit

  • ショートコードとは
  • UIKit を知って活用する
  • 投稿表示 (kns-showpost)
  • アコーディオン(accordion)
  • アラート(alert)
  • バッジ (badge)
  • ボタン(button)
  • グリッド(grid)
  • アイコン (icon)
  • ラベル (label)
  • ライトボックス(lightbox)
  • スライドショー (slideshow)
  • タブ (tab)