やってみようフォルダの ▶ を押して、開いたり閉じたりしてみてください
ナビゲーションマイナー（知る人ぞ知る）
ツリービュー
Tree View
フォルダの横の ▶ を押すと中身が開き、さらにその中のフォルダも開ける。入れ子になった一覧。
別名フォルダツリー階層リストネストリストアウトライン
どこで使われている？
- よく見かける場所
- パソコンのフォルダ、Googleドライブ、VS Code のファイル一覧
- 使うとよい場面
- 階層が深いフォルダやカテゴリを見せたいとき
- 避けたい場面
- 階層が浅い一覧（アコーディオンや普通の一覧でよい）
補足1段だけ開くものは「アコーディオン」と呼ぶことが多いです。
AIへの指示文
これをコピーしてAIに貼り付ければOKです。Webサイトを作る前提の内容です（右上の「何を作る？」で変えられます）。
HTML / CSS / JavaScript で「ツリービュー（Tree View）」を実装してください。 動き：フォルダとファイルを階層ごとに字下げして並べ、フォルダの左に ▶ を置く。押すと ▼ に回転して中身を下に開き、もう一度押すと閉じる。何段でも入れ子にできる。 使う部品：<details> の入れ子、または role="tree" で自作
もっと詳しく：プログラムでの部品名
同じ動きでも、作るものによってプログラムの中での部品の名前が違います。上の指示文にはすでに入っているので、覚える必要はありません。AIの説明に出てきた単語を確認したいときに使ってください。
| Webサイトなら | <details> の入れ子、または role="tree" で自作 |
|---|---|
| iPhoneアプリなら | OutlineGroup / List(children:) |
| Androidアプリなら | 標準部品なし。自作 |
| Flutterなら | TreeSliver |
| React Nativeなら | 自作 |