reStructuredText / Sphinx 中的圖像網格

Question

我正在使用 Sphinx 為我正在處理的 Python 項目創建文檔。 我想在 1x3 網格中顯示三張圖像（即全部在同一行），我試圖弄清楚如何在 reStructuredText 中執行此操作。 現在我有

.. image:: _images/report_title.png

.. image:: _images/report_slide1.png

.. image:: _images/report_slide2.png

我曾想過嘗試在一行中圍繞它們構建一個 reST 表，但這似乎有點荒謬。 如何網格化這些圖像？

Answer 1

您可以將每個圖像的width選項（請參閱reStructuredText 圖像指令文檔）指定為頁面寬度的大約三分之一或更小。

試試，例如

.. image:: _images/report_title.png
   :width: 30%
.. image:: _images/report_slide1.png
   :width: 30%
.. image:: _images/report_slide2.png
   :width: 30%

這里討論了寬度（和高度）選項中允許的長度（它們基本上對應於CSS文檔中的長度單位）。

Answer 2

另一個答案是使用指令作為圖像的別名。

.. |logo| image:: ../iamges/wiki_logo_openalea.png
   :width: 20pt
   :height: 20pt

然后在表中使用別名：

 +---------+-----------+
 | |logo|  +  |logo2|  +
 +---------+-----------+

Answer 3

對於混疊，我有更好的運氣：

.. |logo1| image:: logo1.png    
   :scale: 100%
   :align: middle
.. |logo2| image:: logo2.png
   :scale: 50%
   :align: top

+---------+---------+
| |logo1| | |logo2| |
+---------+---------+

Answer 4

我提供另一個參考。 如果你想放置puml你可以試試

    +---------------------+----------------------+
    | .. uml:: class.puml | .. uml:: class.puml  +
    |    :scale: 100%     |     :scale: 100%     +
    +---------------------+----------------------+

Answer 5

使用無邊框列表::

.. list-table:: simple image grid
   :class: borderless

   * - .. image:: _images/report_title.png
     - .. image:: _images/report_slide1.png
     - .. image:: _images/report_slide2.png

如果您想要標題，也可以與“figure”指令一起使用。