在 Hacker News 上看到「Tree views in css」這篇,講怎麼用純 CSS 技巧達到可折疊的 tree view:

主要是用了 ul
與 li
的 html 結構來搭建 tree view 的意義,再透過 <summary>
與 <details>
這兩個本身就有 toggle 能力的元素來操作展開與收合,後面就是 visual effects 的設計了。
從 Can I use 這邊可以看到支援度沒什麼問題 (連 Android 4.4 的 WebView 都支援),除非你還得跟 IE11 奮戰:「Details & Summary elements」。