四开演示文稿中图像的垂直对齐

Question

我正在使用带有revealjs格式的四开演示文稿。我可以像这样将图像设置为水平居中

![](img/path_to_img.svg){fig-align="center" height="200"}

我试图让图形垂直居中对齐，但我找不到方法。如果我尝试通过将类更改为 来调整幻灯片的 css .center，它确实会将内容垂直居中，但它会居中所有内容而不仅仅是图像。

如何使图像垂直居中？

我尝试过的事情：

• 添加style="padding-top: 150px;有助于使其居中，但很引人注目
• 添加vertical-align: middle;似乎不起作用

Answer 1

您可以在图像的上方和下方创建一些空间，使其看起来像 v 对齐，为此，您需要按layout如下方式使用。

这里layout="[[-1], [1], [-1]]"翻译过来就是，

创建三行，其中第一行和第三行为空白，第二行为一列。

请参阅四开文档中的此处以了解有关布局的更多信息。

---
title: "Vertical align"
format: revealjs
---


## Image alignment (Default)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam luctus ultrices
leo sit amet accumsan.

![](https://placeholder.pics/svg/200){fig-align="center" height=200}


## Vertically Aligned 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam luctus ultrices
leo sit amet accumsan.

::: {layout="[[-1], [1], [-1]]"}

![](https://placeholder.pics/svg/200){fig-align="center"}

:::