半角的不断行的空白格

  这是我们使用最多的空格，也就是按下 space 键产生的空格。
在 HTML 中，如果你用空格键产生此空格，空格是不会累加的（只算 1 个）。要使用 html 实体表示才可累加。
该空格占据宽度受字体影响明显而强烈。在 inline-block 布局中会搞些小破坏，在两端对齐布局中又是不可少的元素

  半角的空格

  此空格有个相当稳健的特性，就是其占据的宽度正好是 1/2 个中文宽度，而且基本上不受字体影响

  半角的空格

  此空格也有个相当稳健的特性，就是其占据的宽度正好是 1 个中文宽度，而且基本上不受字体影响

例子：

<ul>
    <li class="li">姓&emsp;&emsp;名：<input type="text" /></li>
    <li class="li">手&ensp;机&ensp;号：<input type="text" /></li>
    <li class="li">电子邮箱：<input type="text" /></li>
</ul>

文字排版.png

HTML + CSS 实现文字分散对齐

.demo{
    display: inline-block;
    width: 100px;
    text-align: justify;
    text-align-last: justify;
    text-justify: distribute-all-lines; /* 这行必加，兼容ie浏览器 */
}
<span class="demo">用户名</span>