RMarkdown: объедините оглавление с помощью CSS

У меня есть документ Rmarkdown с оглавлением (TOC) слева.

Файл rmd имеет заголовок YAML:

---
title: "Foo"
author: "Bar"
date: "`r format(Sys.time(), '%d-%B-%Y')`"
output: 
  html_document:
    css: bam.css
    theme: flatly
    toc: true
---

Вот bam.css целиком:

#TOC {
  position: fixed;
  left: 10px;
  top: 10px;
  width: 200px;
  height: 100%;
  overflow:auto;
}

#TOC::before {
  content: "";
}

body {
  max-width: 800px;
  margin: auto;
  margin-left:230px;
  line-height: 20px;
}

Есть ли простой способ изменить этот CSS так, чтобы оглавление отображалось как аккордеон?

Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
CSS: FlexBox
CSS: FlexBox
Ранее разработчики использовали макеты с помощью Position и Float. После появления flexbox сценарий полностью изменился.
1
0
328
1

Ответы 1

Я обнаружил, что самый простой способ сделать это - через toc_float в заголовке YAML. Например.,:

 output: 
  html_document:
    theme: flatly
    toc: true
    toc_float: true

Другие вопросы по теме