Dan*_*Dan 7 html r twitter-bootstrap r-markdown blogdown
Bootswatch 的文档建议我可以使用选项卡集中选项卡的下拉菜单:
如何使用 Rmarkdown 实现这一目标?我试过了:
# SECTION 1 {.tabset .tabset-fade}
## Section 1.1
## Section 1.2 {????something here?????}
### Section 1.2.1 <<<<<<<<< want this to appear under the dropdown menu
Run Code Online (Sandbox Code Playgroud)
现在可以在rmarkdown的开发版本中使用它,您可以通过devtools::install_github("rstudio/rmarkdown"). 要添加下拉菜单,您必须添加 .tabset-dropdown到类标题中,如下所示:
---
output: html_document
---
# Heading {.tabset .tabset-dropdown}
## Dropdown 1
## Dropdown 2
## Dropdown 3
## Dropdown 4
Run Code Online (Sandbox Code Playgroud)
目前,我认为仅使用 rmarkdown 无法完成此操作。但是,您可以使用 rmarkdown 生成带有选项卡集部分的 HTML 文档,然后调整 HTML 以将选项卡集转换为下拉菜单。或者,您可以使用bsselectR包,不幸的是,该包的开发仍然有些停滞。
下面是如何使用 rmarkdown 制作 HTML 文档并用下拉菜单替换选项卡集的示例。
首先,您编写 rmarkdown 文档,然后将其编织为 HTML。
---
title: "Tabset Example"
output: html_document
---
# The Tabset Section {.tabset .tabset-fade}
## First Tab
Here is the first tab's content.
## Second Tab
Here is the second tab's content
```
Run Code Online (Sandbox Code Playgroud)
然后,在生成的 HTML 文件中,您会找到以下 HTML 部分:
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active">
<a role="tab" data-toggle="tab" href="#first-tab" aria-controls="first-tab">First Tab</a>
</li>
<li role="presentation">
<a role="tab" data-toggle="tab" href="#second-tab" aria-controls="second-tab">Second Tab</a>
</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
并将其替换为以下 HTML:
<ul class="nav nav-tabs" role="tablist">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false">
Choose a Tab <span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li class=""><a href="#first-tab" data-toggle="tab" aria-expanded="false" aria-controls="first-tab">First Tab</a></li>
<li class=""><a href="#second-tab" data-toggle="tab" aria-expanded="false" aria-controls="second-tab">Second Tab</a></li>
</ul>
</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
这应该会导致您的选项卡集显示为下拉菜单,如下所示:
| 归档时间: |
|
| 查看次数: |
9609 次 |
| 最近记录: |