<br>
、\newpage
など、RMarkdownドキュメントに空白を追加するためのいくつかの提案を見つけました。
これらは私のHTML出力では機能しません。おそらくもっと良い方法があります。以下の例で2つのことをしたいと思います。
(1)タイトルと最初のヘッダーの間に空白を追加します
(2)最初の段落と2番目の段落の間に余分な空白を追加します
以下に示すデフォルトのRマークダウンドキュメントを使用してみましょう。 HTML出力用にこの余分な空白をどのように実現しますか?
---
title: "Here is the title"
output: html_document
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```
## R Markdown
FIRST PARAGRAPH This is an R Markdown document. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see <http://rmarkdown.rstudio.com>.
SECOND PARAGRAPH you click the **Knit** button a document will be generated that includes both content as well as the output of any embedded R code chunks within the document. You can embed an R code chunk like this:
div
要素を使用して、 Rマークダウンファイル 内のセクションを分割します。各div
タグ内で、それぞれを割り当てます margin-bottom
プロパティマージン値。 100%に近い値は、空白の量を増やします。
SO post Rmarkdown html whitespace への@MartinSchmelzerの回答に感謝します。
---
title: "Here is the title"
output: html_document
---
<div style="margin-bottom:100px;">
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```
</div>
## R Markdown
<div style="margin-bottom:50px;">
</div>
FIRST PARAGRAPH This is an R Markdown document. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see <http://rmarkdown.rstudio.com>.
SECOND PARAGRAPH you click the **Knit** button a document will be generated that includes both content as well as the output of any embedded R code chunks within the document. You can embed an R code chunk like this:
質問はhtml_document
のスタイル設定に関するものなので、いくつかのCSS
ルールを使用する必要があります。目的のフォーマットを取得する方法はたくさんあります。
目標を達成する一連のCSS
ルールを見つけるには、レンダリングされたHTML
ドキュメントを検査する必要があります。質問で提供されたデフォルトのR Markdown
ドキュメントの関連するHTML
フラグメントは次のとおりです。
<div class="fluid-row" id="header">
<h1 class="title toc-ignore">Here is the title</h1>
</div>
<div id="r-markdown" class="section level2">
<h2>R Markdown</h2>
<p>FIRST PARAGRAPH This is an R Markdown document. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see <a href="http://rmarkdown.rstudio.com" class="uri">http://rmarkdown.rstudio.com</a>.</p>
<p>SECOND PARAGRAPH you click the <strong>Knit</strong> button a document will be generated that includes both content as well as the output of any embedded R code chunks within the document. You can embed an R code chunk like this:</p>
</div>
margin
property と :first-of-type
pseudo-class を使用する1つのソリューションを次に示します。
---
title: "Here is the title"
output: html_document
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```
```{css echo=FALSE}
/* Define a margin before h2 element */
h2 {
margin-top: 6em;
}
/* Define a margin after every first p elements */
p:first-of-type {
margin-bottom: 3em;
}
```
## R Markdown
FIRST PARAGRAPH This is an R Markdown document. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see <http://rmarkdown.rstudio.com>.
SECOND PARAGRAPH you click the **Knit** button a document will be generated that includes both content as well as the output of any embedded R code chunks within the document. You can embed an R code chunk like this:
最終的なドキュメントでこれらのCSS
ルールを使用すると、各h2
要素の前と各最初のp
要素の後にスペースが入るため、がっかりする可能性があります。したがって、div
識別子を持つ要素を選択することをお勧めします。
```{css echo=FALSE}
#r-markdown {
margin-top: 6em;
}
#r-markdown p:first-of-type {
margin-bottom: 3em;
}
```
空白行を追加する簡単な解決策は、$〜$を使用することです。
これにより、空白の行が追加され、html出力で確実に機能しました。
# R Markdown
Some text
$~$
More text after a white space