如何在HTML中创建小空格?

时间:2010-04-27 11:39:04

标签: html layout typography

有冲刺和冲刺。是否有“en”等同于& nbsp; ?是否 en 等同于纯 Ascii 32

我想要一个更好的方法来写这个:

123<span class="spanen">&nbsp;</span>456<span class="spanen">&nbsp;</span>789

或者这个:

123<span class="spanen"> </span>456<span class="spanen"> </span>789

5 个答案:

答案 0 :(得分:44)

&thinsp;(空间)应该

&nbsp;&mdash;( - )不同,要分隔数字,您应使用狭窄的不间断空格(U + 202F)。

正如其他人所提到的,你最好使用css属性word-spacing来定义空格的宽度。将它与white-space:no-break;

结合起来可能是个好主意

答案 1 :(得分:19)

不要使用没有意义的黑客。如果你想分开一些单词,我建议你使用CSS属性word-spacing

.strangeNumbers {
  word-spacing: 0.5em;
}
<span class="strangeNumbers">123 456</span>

答案 2 :(得分:13)

Unicode字符U + 2002 EN SPACE &#x2002;&#8194;或实体引用&ensp;)是一个宽度为的空格。

答案 3 :(得分:3)

&thinsp;

...并且某些固定字体中没有正确实现各种其他非标准空格字符。

这将以无法控制的方式破坏您在网络浏览器端的渲染,并且您无法通过具体了解字体来修复它,因为您无法控制正在使用的实际字体通过网络浏览器 - 即使你指定了font-name或font-family,也不代表他们拥有的字体与你所拥有的字体相同。

但是,你可以建立一个100%兼容的空间,任何你想要的尺寸,而且非常容易。 em 值是当前 font-size。它是高度,但无论字体的宽度如何,它相对于固定宽度字体的高度始终是一个常数。所以你可以利用它。

以下是如何在与所有内容一起使用的固定宽度字体的上下文中创建 1/2宽度,不间断空格。我用span style=""选项显示它实现,但当然你可以创建一个CSS类来减少它的使用:

<span style="font-size: .5em;">&nbsp;</span>

以下是如何制作 1/4宽度,不间断空间:

<span style="font-size: .25em;">&nbsp;</span>

......等等。

这总是适用于小于当前全宽空间的空间大小,因为该字符比线上的其他字符短,因此它们控制行间距,而不是较短的字符。

如果您想要一个更宽的空间而不是一个空格,请使用完整空格和较短空格的组合。如果你使用1.5em之类的东西获得更宽的空间,你也会得到更高的空间,这样会影响行间距。

虽然这个解决方案非常麻烦,但它具有总是工作的理想属性 - 其他人都没有。

答案 4 :(得分:2)

你可以改变你的CSS:

.spanen{word-spacing:.6em;}