0

我的 Sphinx 项目为使用内联代码字体的文档生成 HTML。我使用的文本字体是 Lato;代码字体是 Consolas。

问题在于,无论文档从文本字体转换为内联代码的任何位置,Sphinx 都会插入额外的空间。下面是文本的外观(在另一个应用程序中模拟)和实际外观的快照:

在此处输入图像描述

在此处输入图像描述

行首的代码问题尤其明显。额外的空间使该行看起来是缩进的:

在此处输入图像描述

看起来 Sphinx 正在生成 HTML,它以代码字体组合前面和后面的单词,但事实并非如此:

在此处输入图像描述

我使用的另一个排版工具没有这样做,尽管它会生成类似的 HTML:

在此处输入图像描述

在此处输入图像描述

我假设项目的样式表为 Consolas 字体提供了一些属性,在字体转换前后增加了空间,但我在样式表或浏览器的 HTML 检查器中找不到它。实际上,我在 HTML 中找不到可以做到这一点的属性。我应该寻找什么?


后来——这是对史蒂夫皮尔西评论的回应。我正在编辑原始消息,因为我无法在评论中插入图形。

史蒂夫让我附上一个可重现的样本。恐怕这会很困难,因为项目的某些部分(主题,即基础设施,而不仅仅是内容)是专有的。我应该能够将样式表与主题分开,并使用它们在“干净​​”主题中演示问题,但要做到这一点,我需要了解更多关于主题的知识。可能需要一段时间才能找到时间。

作为一种替代方法,我从浏览器的 HTML 检查器中附加了输出、HTML 和整套适用样式的快照。所有相关信息都应该在那里。

显示器:

显示器

生成它的 HTML:

生成它的 HTML

样式 (1 of 5)

样式 (1 of 5)

(5 个中的 2 个)

(5 个中的 2 个)

(5 个中的 3 个)

(5 个中的 3 个)

(5 个中的 4 个)

(5 个中的 4 个)

(5 个中的 5 个)

(5 个中的 5 个)

回应史蒂夫皮尔西,11/29:

我遵循史蒂夫的 11/29 建议并看到以下内容。

对于一段内联代码:

border-collapse: collapse;
border-spacing: 0px 0px;
box-sizing: border-box;
color: rgb(0, 0, 0);
empty-cells: show;
font-family: SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, Courier, monospace;
font-size: 13.9333px;
font-weight: 500;
line-height: 17.6px;
text-align: left;
white-space: nowrap;

对于封闭体类型:

border-collapse: collapse;
border-spacing: 0px 0px;
box-sizing: border-box;
color: rgb(0, 0, 0);
empty-cells: show;
font-family: "Helvetica Neue", Arial, sans-serif;
font-size: 14.6667px;
font-weight: 400;
line-height: 17.6px;
margin-bottom: 5.86667px;
margin-left: 0px;
margin-right: 5px;
margin-top: 10.2667px;
overflow: visible;
overflow-x: visible;
overflow-y: visible;
padding-bottom: 0px;
padding-top: 0px;
text-align: left;
white-space: normal;

我看到的唯一可能相关的属性是内联代码中的 box-sizing 和 body 类型中的 margin-right。我尝试更改两者(分别更改为 content-box 和 0),但这没有效果。

12 月 5 日:Steve Piercy 写道,“你越来越近了。我看到了 4 个 margin-* 属性,你可以检查和覆盖它们。”

恕我直言,我没有看到任何类似的东西。我选择了一段内联代码并在属性堆栈上上下滚动了几次,当我找不到边距属性时,我将整个内容复制并粘贴到文本编辑器中并搜索“边距”。没有实例。

这是代码检查器右侧列的全部内容(仍然选择了一段内联代码):

在此处输入图像描述

4

1 回答 1

0

只是一个说明,让你知道我发现了问题。包装内联代码的 <span> 标记没有填充,但另一个标记——更上两层——有!我将该标签从“填充:2px 5px;”更改为 到“填充:2px 0;” 问题解决了。

感谢大家的努力帮助。你真的有帮助;我只是在尝试简化可以在没有专有内容的情况下上传的完整 HTML 示例时才发现问题。

于 2021-12-29T19:25:17.507 回答