Rmarkdown中不同高度的垂直顶部对齐图形

Question

我有一个 Rmarkdown 代码块，我想在其中显示两个不同高度的外部图形，并让它们在顶部垂直对齐。我正在输出一个 HTML 文档。

这是代码

```{r, fig.show='hold', out.width="25%"}
include_graphics("leftfig.png")
include_graphics("rightfig.png")

这会产生 middle-aligned side-by-side 图（不是实际图像，仅用作示例）。

不过，我想要这两个数字top-aligned。我已经尝试了块选项的各种组合，但我没有找到与垂直对齐相关的 fig.align 选项，也没有看到管理的 YAML header 的选项这个。

如有任何帮助，我们将不胜感激。

Answer 1

CSS 的快速解决方法（应用于整个文档）：

---
title: "Test"
output: html_document
---

```{css}
img {vertical-align: top;}
```

```{r, fig.show='hold', out.width='25%'}
knitr::include_graphics("leftfig.png")
knitr::include_graphics("rightfig.png")
```

Answer 2

一种允许您设置 local 而不是 global 的方法，and/or 图像中的数字垂直对齐html 输出文档利用 CSS 样式链接到指定给任何 HTML div 标签的特定 HTML class 属性的效用。

---
title: "Test"
output: html_document
---

<style type="text/css">
.topalign img {
  vertical-align: top;
}
</style>

<div class="topalign">
```{r, fig.show='hold', out.width='25%'}
knitr::include_graphics(c("leftfig.png", "rightfig.png"))
```
</div>

Note: I've also taken the liberty to demonstrate how the include_graphics() function can actually take a vector of image paths, thus only having to call the function once per code chunk.

一旦在文档顶部定义了 CSS，这个 div 标签：<div class="topalign"> ... </div> 可以环绕在 [=26= 周围] 评估了您希望拥有的 rmarkdown 代码块 top-aligned。

Rmarkdown中不同高度的垂直顶部对齐图形

Vertical top align figures of different height in Rmarkdown

html

r-markdown

multiple-columns

vertical-alignment

figure