0

根据排版规则，如果标点符号后有间隔文本，则不应有空格，但如果后有无间隔文本，则间隔更大。与间隔文本左侧的空间类似。

我目前的解决方案：`

<!DOCTYPE html>
<html>
<head>
<style>
h1 { font-size: 1.5em; }

.spaced { letter-spacing:0.5em; }
  .spaced:before { content:''; margin-left:0.5em; }
/* .spaced:after  { content:''; margin-right:0.5em; } */

h1 span { border: 1px solid red;}

.dot_before:before  { content:''; margin-left:-0.0em; }
.dot_after:after    { content:''; margin-right:-0.5em; }

</style>
</head>
<body>
<h1>A. "<span>Plain</span>"</h1>
<h1>B. "<span class='spaced'>Spaced only</span>"</h1>
<h1>C. "<span class='spaced dot_before dot_after'>Before and after</span>"</h1>
<h1>D. Normal <span class='spaced'>Spaced</span> Normal.</h1>
<h1>E. <span class='spaced dot_before'>Spaced</span> Normal.</h1>
</body>
</html>

这意味着，它需要根据前面或后面的标点符号设置额外的类，但在其他情况下不需要。在内容编辑 JavaScript 的情况下，人工编辑器或服务器端必须小心。

有人知道更简单的解决方案吗？

编辑：注释掉不必要的规则，添加示例 D. 和 E. 以确保所需行为的完整性。B. 不受欢迎。

4

0 回答 0