Html 如何仅使用CSS实现每两个字母的间距？

以下是我的html代码：

<span class="number">0102030405</span>

但每个数字之间应用了间距。如何应用每两个数字的间距

注意：

---

我正在寻找一个只使用CSS的解决方案，我不确定你是否可以用CSS来实现。无论如何，你可以用javascript来实现。代码如下：

 String.prototype.chunk = function(n) {
   var space = [];
   for(var i=0, len=this.length; i < len; i += n) {
     space.push(this.substr(i, n))
   }
   return space
 };

"0102030405".chunk(2).join('  ');

String.prototype.chunk=函数（n）{
var空间=[]；
对于（变量i=0，len=this.length；i

---

检查

以获得仅CSS的解决方案，而不使用第n个字母选择器，您将要处理的解决方案。您无疑知道，目前没有第n个字母，所以这里有一个可能的解决方法，尽管这个方法很难看

如果您愿意为

.number

的每个实例进行调整，那么您可以使用以下基于使用列拆分数字对的方法。对于给定的示例，效果非常好：

.number {
    width: 8em;
    display: block;
    word-wrap: break-word;
    columns: 5;
    column-gap: 0.2em;
}

见：

宽度

、

列

和

列间距

值需要根据标记中的数字以及所选字体大小进行调整。您还需要调整它们以更改列之间的空间。不幸的是，如果有数字具有不同的位数（例如，1200、3200、39000、42、100000），则这肯定会中断。你要求将两个数字分开，希望这对你来说不是问题

---

理想情况下，您可以使用或任何JavaScript将您的字母拆分为不同的

span

元素，然后您可以将这些元素与

组合。编号span:nth child（2n）

以添加所需的间距。请参阅：

这不能在CSS中完成，因为没有选择器可以引用元素内容中的第三个字符或前两个字符。CSS对元素和伪元素进行操作，当前没有定义的伪元素适合于此

---

如果可能，应在服务器端修改内容，如果不可能，则使用客户端JavaScript修改内容，以使字符对显示为元素或它们之间有空格字符，例如

01 02 03 05

。在后一种情况下，您可以使用

字间距

（可能为负值）来调整间距量。

为什么不能在标记中将它们分开，然后使用

字间距

？没有第n个字母选项，就像第n个孩子的选项一样。显然，有人在谈论如何实现它，但它还没有出现在css中。在现在，仅仅使用css（没有JS）是不可能的，但在将来。。。一个可能的解决办法，但OP正在寻找一个css唯一的方法伟大的答案，它像一个魅力：）最后一点，我想强调的数字，但线被切断了。您知道如何在空白处加下划线吗？将

边框底部

添加到

.number

类中。它将跨越块的宽度。

.number {
    width: 8em;
    display: block;
    word-wrap: break-word;
    columns: 5;
    column-gap: 0.2em;
}