以狮身人面像为中心的标题

Question

我正在用 sphinx 编写一个文档，其中包含三种主要类型的元素：标题、图像和纯文本。偶尔有些元素需要居中：

Heading
=======

.. rst-class:: center

A centered paragraph, followed by non-centered image.

.. image:: /_static/exhibit_a.png

A non-centered paragraph, followed by centered image.

.. image:: /_static/exhibit_b.png
   :class: center

常规文本和图像居中很好，因为我注册了一个 CSS 文件，如下所示：

.center { text-align: center; }
img.center {
    display: block;
    margin: auto;
}

但是，以下内容无法正常工作：

.. rst-class: center

===================
A Heading 1 Element
===================

Some generic text

reST class (sphinx rst-class) 指令应该只应用于紧随其后的元素，但在这种情况下，整个部分将居中对齐，其中包含所有内容.在这个例子中，Some generic text 居中显示，但应该是 left-aligned。事实上，像这样将文档中的第一个标题居中几乎可以使整个文档居中。

如何使标题居中对齐，使其仅适用于 <h1> 标记而不适用于整个部分？

我在 sphinx 1.8.0 上使用阅读文档主题，以防万一。

其他想法

就我而言，我需要修改所有 <h1> 和 <h2> 实例，而不需要修改其他标题。我知道这在 CSS 中用

做起来很简单

h1 h2 { text-align: center; }

但是，此特定文档是一个更大项目的一部分，我想在其中保持所有原始样式不变。执行此操作的唯一方法是仅针对该文档包含我的 CSS 自定义。这是一个可能的选择吗？

更多想法

错误发生是因为 center class 被附加到围绕整个部分的 <div>，而不是 <h1> 标签。但是，我希望能够允许某些 div（如扩展行）具有 center class。只是不是带有 section class.

的 div

Answer 1

连同 .. rst-class: center 的 reST 标记，尝试组合 CSS 选择器，如下所示：

.center h1,
.center h2 {
    text-align: center;
}

因此文档中只有 h1 和 h2 会居中。

Answer 2

我的想法是取消select 包含我想要的部分的 <div> 元素，并 select 在 CSS:

.center:not(.section), .center>h1, .center>h2 {
    text-align: center;
}

这不是 select 带有 section class 的 outer-level div，而是将标题置于其下方的中心位置。 :not 似乎是 IE8 不支持的 CSS3 功能，但这一点也不困扰我：https://whosebug.com/a/2482475/2988730

使用 .center>h1 而不是 .center h1 确保我只得到我标记的确切标题，而不是所有嵌套的标题。虽然后者非常方便，但如果我使用它，我肯定会运行遇到问题。

以狮身人面像为中心的标题

Centered Heading With Sphinx

python

restructuredtext

python-sphinx