如何在Sphinx中为生成的<ul>元素自定义class属性
如何在Sphinx中为生成的
- 元素自定义class属性
嗨Olivier,我来帮你搞定这个问题!你想给Sphinx生成的引用列表<ul>替换自定义class,方便用CSS样式化,对吧?这里有几个实用的方法,你可以根据自己的需求选择:
方法1:用容器间接样式化(最推荐,简单通用)
如果不想折腾复杂的配置,这个方法最省心——用reStructuredText的容器指令把你的引用列表包起来,然后通过容器的class来定位内部的<ul>元素。写法如下:
.. _ahn-kwon-14: .. container:: my-ref-container * A----. 2014, J. Number Theory, 145, 433--473.
生成的HTML会是这样的结构:
<div class="my-ref-container"> <ul class="simple" id="ahn-kwon-14"> <li><p>A----. 2014, J. Number Theory, 145, 433–473.</p></li> </ul> </div>
之后你就可以在CSS里这样写样式:
.my-ref-container ul { /* 这里写你的自定义样式 */ color: #333; margin-left: 2em; }
这种方法不影响其他输出格式(比如PDF、EPUB),兼容性最好。
方法2:直接给列表指定自定义class
如果你想直接给<ul>元素添加自定义class,可以用reStructuredText的.. class::指令,写法如下:
.. _ahn-kwon-14: .. class:: my-very-own-refs * A----. 2014, J. Number Theory, 145, 433--473.
生成的HTML里,<ul>会同时保留默认的simple类和你自定义的my-very-own-refs类:
<ul class="simple my-very-own-refs" id="ahn-kwon-14"> <li><p>A----. 2014, J. Number Theory, 145, 433–473.</p></li> </ul>
这样你就可以直接用.my-very-own-refs来写CSS样式了,默认的simple类如果有冲突,用CSS优先级覆盖就行(比如.my-very-own-refs { ... }的优先级足够)。
方法3:直接写HTML(仅适合纯HTML输出场景)
如果你的项目只需要生成HTML格式,也可以直接用raw指令写原生HTML,这样完全自定义结构:
.. raw:: html <ul class="my-very-own-refs" id="ahn-kwon-14"> <li><p>A----. 2014, J. Number Theory, 145, 433–473.</p></li> </ul>
不过这种方法的缺点是,其他输出格式(比如PDF)会忽略raw HTML内容,所以只适合单一HTML输出的项目。
你之前试过CSS类但没找到门路,应该是没把.. class::指令和引用标签、列表的格式配合对,试试上面的方法1或2,应该就能解决你的问题啦!
内容来源于stack exchange




