Изображение с выравниванием по центру в README.adoc (AsciiDoc) на GitHub

Я хочу выровнять изображение по центру в файле README.adoc на GitHub.

Я знаю, что для файлов 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]

Это отображает правильное изображение, но выровненное по левому краю.


github asciidoc readme
person HerCerM    schedule 22.06.2020    source источник
comment
То же самое и здесь: align="center" игнорируется (не существует) в HTML-коде, отображаемом GitHub. Вероятно, это ошибка GitHub. Ничего общего с центром. В ваших атрибутах изображения выше. Интересно, пропустили ли вы числовую информацию о ширине и высоте. Должно ли быть [A map, 350, 350, align="center"]   -  person Polymerase    schedule 23.06.2020
comment
@Polymerase Я также пытался установить позиционный атрибут высоты, но GitHub отображает его с точным набором размеров, а не сохраняет соотношение сторон, как это выглядело бы при преобразовании в PDF или HTML с помощью asciidoctor CLI. Отсутствие атрибута высоты изменяет размер изображения до нужной ширины и сохраняет соотношение сторон в GitHub.   -  person HerCerM    schedule 23.06.2020

Ответы (1)


arrow_upward
5
arrow_downward

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

Я рекомендую использовать условный блок, чтобы использовать этот проход только тогда, когда README отображается на GitHub:

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::[]
person Mogztter    schedule 28.06.2020