html - 为网页提供独立的可滚动目录 Pane

Question

目前我有一个看起来像这样的网页

我预计目录会增加很多。因此，我想在页面的左侧有一个单独的 Pane ，它可以独立滚动和折叠(有点像 https://docs.python.org/3/ )。这可以从 CSS 样式表中指定吗？我通常使用 pandoc 和 markdown 以及自定义的 css 样式表来布局我的网页。

另外，我如何才能拥有一个单独的网页(比如我网站的主页)，其中仅包含目录以及指向实际文章的链接列表，例如诺姆乔姆斯基的 website .同样，首选使用 pandoc 和 markdown 的解决方案。

Answer 1

尝试类似下面的 CSS:

#TOC {
  position: fixed;
  top: 10px;
  left: 10px;
  overflow: scroll;
}
body {
  width: 300px;
  margin-left: 300px;
}