HTML在复制文本时忽略空白

我有IBAN（例如CZ5220100000000123456789），为了更好的可读性，我想在每四个字符（CZ52 2010 0000 0001 2345 6789）后面插入空格。但是网上银行只接受不带空格的IBAN，如果有人复制了这个IBAN，他必须在粘贴之前删除这些空格

在第I段中，我将这样解决它：

<style type="text/css">
    span { margin-right: 0.5em }
</style>

<p><span>CZ52</span><span>2010</span><span>0000</span><span>0001</span><span>2345</span>6789</p>

span{右边距：0.5em}
CZ5220100000000123456789

但是，在不支持html的input标记中（没有JS）有可能实现这一点吗

---

请更正我的英语。

将

放在要用空格分隔的字符之间的值属性中。

您最终可以使用背景和字体系列，如courier：

.iban{
字母间距：1px；/*使我们中的一些人更容易阅读*/
字体系列：courier；/*所有字母/数字的宽度相同*/
显示：内联块；/*将它们放在一起*/
背景：线性渐变（向左，浅灰色50%，透明50%）左黄色；/*在后面画一些颜色*/
背景尺寸：33.33%/*因为我们需要重复3次*/
文本阴影：0 0 1px黑色；/*增加厚度*/
}

---

CZ5220100000000123456789

据我所知，它只能通过JS实现，不过你可以试试这个-

HTML

---

注意：我没有检查这是否适用于移动设备/触摸屏。我建议使用一些JS解决方案。如果用户更改输入中的文本-范围中的文本不会更改。

此答案是错误的。尝试此操作，然后从文本框中复制文本。复制的文本仍将包含空格。我刚刚用一个

input

标记改编了您的示例：@oliverpool，在这种情况下，您应该使用em值作为宽度和字母间距，否则部分数字将丢失或数字将过短：）这不是我需要的，但是它非常聪明：）我会在其他地方使用它。说实话，我不认为

input

是合适的标签。你不能通过设置输入标签的样式来添加额外的字符，任何依赖于透明背景的输入解决方案可能不会在所有浏览器中都很好地显示。我知道，在这种情况下，输入是个问题，但我只是好奇，如果没有JS，是否有可能。

<div class="iban">
    <input type="text" value="CZ5220100000000123456789" />
    <span>CZ52 2010 0000 0001 2345 6789</span>
</div>

.iban {
    position: relative;
}
.iban span {
    position: absolute;
    margin-right: 0.5em;
    padding: 1em;
}
.iban:hover span {
    display: none;
}
.iban input {
    display: none;
}
.iban:hover input {
    display: inline;
}
input {
    position: absolute;
    padding: 1em;
}
.iban span, input {
    font-family: Tahoma;
    font-size: 12px; 
    width: 200px;
    border: 1px solid gray;
}