內容展示詞條 2-28
樹狀選單Tree Menu
也常叫做：階層選單、Tree
你可能會這樣說
點「產品」展開「男裝、女裝」，再點「男裝」又展開「上衣、褲子」——分類有上下層的選單結構。
白話解釋
樹狀選單是有上下階層、能一層層展開的選單，長得像檔案總管裡的資料夾結構。
它適合分類又深又多的內容；但層級超過三層人就會迷路，搭配「麵包屑」顯示目前位置會保險很多。
請 AI 做時，把階層用縮排的方式列出來，並說明展開行為和選中樣式。
親手試試
✕ 全部攤平
男裝／女裝／童裝／上衣／褲子／外套／洋裝／T恤／襯衫／牛仔褲／運動褲／連帽外套／風衣／羽絨衣
十四個分類全部攤平，誰包含誰完全看不出來。
✓ 一層層收合
▾ 男裝
▾ 上衣
• T恤（你在這）
• 襯衫
▸ 褲子
▸ 外套
▸ 女裝
▸ 童裝
一層一層展開，現在走到的路徑用顏色標出來。
層級超過三層人會迷路，記得配麵包屑報位置。
這樣對 AI 說
中文就可以
側邊做一個產品分類的樹狀選單，最多三層。 有子項的分類前面放三角形，點了展開並轉向。 同一層一次只展開一個，其他自動收合。 目前所在的分類要高亮，換頁後仍保持展開。