时间戳

首页 > 解决方案 > 在 GitHub 上的 README.adoc (AsciiDoc) 中居中对齐图像

github - 在 GitHub 上的 README.adoc (AsciiDoc) 中居中对齐图像

问题描述

我想在 GitHub 的 README.adoc 文件中居中对齐图像。

我知道对于 Markdown 文件，添加 HTML如下所示：

<p align="center">
  <img width="460" height="300" src="http://www.fillmurray.com/460/300">
</p>

但是，我想用 AsciiDoc 编写文件，而不是 Markdown。

我尝试过但没有奏效的方法

假设在与 README 相同的目录中有一个 map.png 图像。

image::map.png[A map, 350, align=center]

这将显示正确的图像，但与左侧对齐。

标签： githubasciidocreadme

解决方案

GitHub 使用 Asciidoctor，但去掉了 CSS 类和内联 CSS 样式。作为一种解决方法，您可以使用直通（这并不理想）：

++++
<p align="center">
  <img width="460" height="300" src="http://www.fillmurray.com/460/300">
</p>
++++

您也可以对此问题发表评论/投票：https ://github.com/github/markup/issues/984

我建议仅在 GitHub 上呈现 README 时使用条件块来使用此传递：

ifdef::env-github[]
++++
<p align="center">
  <img width="460" height="300" src="http://www.fillmurray.com/460/300">
</p>
++++
endif::[]

ifndef::env-github[]
image::map.png[A map, 350, align=center]
endif::[]

推荐阅读