如何在Marp或Marpit中实现图片位于文字标题下方对齐

你使用bg关键字标记的图片会被Marp识别为幻灯片背景层，默认会和前景文字内容重叠，再加上Marp幻灯片默认内容居中对齐，就会出现文字叠在图片中间的问题。以下是两种常用解决方案：

这是最简便的方案，去掉bg标记后，图片会和文字按从上到下的顺序正常流式排布，不会出现重叠问题。

---
marp: true
---

# 这段文字应当作为标题显示

![C程序编译步骤](https://csgeekshub.com/wp-content/uploads/2020/07/C-Program-compilation-steps-and-process.jpg)

如果需要调整图片显示尺寸，可以在alt文本区域添加尺寸参数，比如限制图片宽度为900像素：![C程序编译步骤 w:900](图片链接)

如果你确实需要将图片作为背景使用，可以分别调整背景图的对齐位置和前景文字的排版规则，让两者互不重叠：

---
marp: true
---
<!-- 修改页面排版规则，让内容靠上对齐，顶部预留标题空间 -->
<style>
section {
  justify-content: flex-start;
  padding-top: 3rem;
}
</style>

# 这段文字应当作为标题显示

<!-- 背景图设置为靠下对齐，空出顶部区域放置标题 -->
![bg contain bottom](https://csgeekshub.com/wp-content/uploads/2020/07/C-Program-compilation-steps-and-process.jpg)

内容的提问来源于stack exchange，提问作者Wakan Tanka