对齐图标标题Sphinx

Question

我无法选择在sphinx中对齐图形的图例文本。

.. figure:: check_validity.png
   :align: center

   ..

   Left: the source layer

   Right: in blue the valid layer, in green the invalid layer and in red the error
   layer

结果如下：

但我希望两个标题左对齐。这可能不使用表吗？

Answer 1

是的，但它非常笨重，需要自定义CSS来计算每个图像的宽度。

这是Sphinx为我生成的HTML：

<div class="figure align-center">
    <img src="check_validity.png" />
    <div class="legend">
        <p>Some text</p>
        <p>Another sentence</p>
    </div>
</div>

根据您的主题，您需要：

1. 获取图像的宽度（WI）
2. 获取内容区域（WCA）的宽度，如果它是一个流动的，可变宽度的区域，则可能无法实现
3. 计算左边距：LM =（WCA-WI）/ 2
4. 使用CSS选择器
将LM作为左边距应用于段落块

使用表格要容易得多。欢迎来到20世纪90年代！

这是reST标记：

.. rst-class:: table-center

+--------------------------------+
| .. figure:: check_validity.png |
|                                |
|   ..                           |
|                                |
|   Left: the source layer       |
|                                |
|   Right: in blue the valid     |
|   layer, in green the invalid  |
|   layer and in red the error   |
|   layer                        |
+--------------------------------+

您需要在CSS文件中添加自定义样式：

table.table-center {
    margin-left: auto;
    margin-right: auto;
}