html - 使用CSS的段落中每个句号后的两个空格？

Question

如何使用 CSS 在段落的每个句号后放置两个空格？

Answer 1

啊，旧的“一个时期后两个空格”模因再次抬起丑陋的头。

句号后的两个空格与打字机世界或等宽字体世界有关。我们很久以前就超越了它，从 TeX 甚至更早开始。关键不是在句号之后有一个或两个空格字符，而是在那里有一个令人愉悦的空格。像 TeX 这样的算法会竭尽全力做到这一点。相比之下，现代网络浏览器中的算法仍然很原始，但开始做得更好。考虑以下：

您会看到句点后的空格（略）大于字间距，这是应该的。

称义的情况如何？您希望浏览器在句子之间放置额外的空格，而不是放在单词之间。这就是发生的事情：

无论如何，因此您需要更细粒度的控制，以在您的网页上实现您自己的排版愿景。以下 句子之间有四个字符：

您还可以使用 Unicode 中不同宽度的空格来获得所需的空间量（请参阅Wikipedia 文章）。

那么有没有办法自动做到这一点？CSS 有一个word-spacing属性，但没有sentence-spacing属性（实际上，要弄清楚“句子”是什么并不容易，即使是在英语中，在其他语言中也不那么容易）。当然，在你的 HTML 中放置更多的空格是没有用的，因为 HTML 将任何空格视为一个空格。因此，您将不得不编写一些代码，或者找到一个插件，它会遍历页面中的文本并插入标记。或者，将插件或其他东西添加到您的 CMS 以吐出适当标记的代码。您这样做的替代方法是：

1. 添加 或组合不同宽度的 Unicode 空格。
2. 正如另一位海报所建议的那样，使用span带有margin.
3. 作为上述的变体，使用<span class="sentence">具有 CSS 规则的元素，例如.sentence::after { content: "\2002"; }，其中 2002 是“en-space”。这导致：

然而，底线是网络不是一个印刷环境，尽管许多有价值的努力推动它朝那个方向发展。例如，根据您的目标，您可能会考虑在高端文档准备环境中创建文档，然后将它们发布为 PDF。

Answer 2

你可以把你的句号放在一个跨度标签中，并给它一些 CSS 属性，比如“margin-right: 5px;”，如果它只是你正在寻找的外观。

Answer 3

仅当您将句号放在标签上时才能完成，例如<span>. 例如 ：

www<span>.</span>google<span>.</span>com

然后css是：

span:after{
   content : "  "; /*two spaces*/
}

Answer 4

句子后面的两个空格概念并不“丑陋”——事实上，恰恰相反。由于现代字体字距调整以及 Web 浏览器现在支持的各种字体，有时很难确定一个句子是否已经结束，或者是否只是一个需要句号的缩写词，更不用说看不断运行。以“胖”字母开头的句子，例如大写的“W”，看起来好像实际上根本没有空格。在句子后添加额外的空格可以为读者提供明确的休息时间。但是，我知道创建可以“理解”一个句子是什么的 CSS 是非常困难的，这样它就会在每个句子之后自动插入一个额外的空格。