How to create small SPACES in HTML?

一世执手 提交于 2019-12-03 04:15:36

问题


There is em dash and en dash. Is there an "en" equivalent to   ? Is there an en equivalent to pure Ascii 32?

I want a better way to write this:

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

or this:

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

回答1:


Don't use hacks that make no sense. If you wish to separate some words, I suggest you use the CSS property word-spacing:

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



回答2:


&thinsp; (thin space) should do

and &nbsp; has not the same with as an &mdash; (—), to separate numbers you should use a narrow no-break space (U+202F).

as others have mentioned, you are better off using the css property word-spacing to define the width of your spaces. it's probably a good idea to combine it with white-space:no-break;




回答3:


The Unicode character U+2002 EN SPACE (&#x2002;, &#8194; or as entity reference &ensp;) is a space with en width.




回答4:


&thinsp;

... and various other non-standard space characters are not properly implemented in some fixed fonts.

This will will foul up your rendering on the web browser end in an uncontrollable manner, and you can't fix it by being specific about the font, because you can't control what actual font is being used by the web browser — even if you specify the font-name or font-family, that doesn't mean the font they have is the same as the font you have.

But you can build a 100%-compatible space of any size you want, though, and it's very easy. The em value is the current font-size. It's the height, but whatever the width of the font is, it's always a constant relative to the height in a fixed-width font. So you can take advantage of that.

Here's how to make a 1/2 width, non-breaking space within the context of a fixed-width font that works with everything. I show it implemented in a span's style="" option, but of course you can make a CSS class instead to make its use less clumsy:

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

Here's how to make a 1/4 width, non-breaking space:

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

...and so on.

This always works with space sizes smaller than the current full-width space because the character is shorter than the other characters on the line, so they control the line spacing, not the shorter character.

If you want a space that is wider than one space, use a combination of full spaces and shorter spaces. While you will get a wider space if you use something like 1.5em, you will also get a taller space, and so that will affect the line spacing.

While this solution is annoyingly cumbersome, it has the desirable attribute of always working — which none of the others do.




回答5:


You could alter your CSS in such:

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


来源:https://stackoverflow.com/questions/2720770/how-to-create-small-spaces-in-html

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!