需求：
在表单填写或者姓名列表展示时，会出现文字字数不统一，导致文字长度不一的情况，但是又想要文字两端对齐的情况。
思路：
- 对于静态数据，可以使用空格分开，但是在
html中最多显示一个空格，即使打了 n 多空格符，所以可以使用 将文字分开。 - 但是对于动态填充的数据就无法使用方法1，可以使用CSS2中
text-align: justify;实现，但是只是用该属性无法达到目的。
方法2无法实现的原因是该属性针对多行文本
代码1：
div:after {
content: " ";
display: inline-block;
width: 100%;
}
使用该代码，意在通过伪元素撑开 div，造成多行文本假象，实现 text-align: justify; 属性效果。
但是这种方法会撑高 div，这时需要给 div 定义高度，因为伪元素并没有设置高度，所以不影响。
代码2：
上诉方法虽然也能实现，但是毕竟使页面多了一个伪元素。
div {
width: 100px;
border: 1px solid red;
text-align: justify;
text-align-last: justify;
text-justify: distribute;
}
还可以使用text-align-last: justify;
justify
最后一行文字的开头语内容盒子的左侧对齐，末尾与右侧对齐。
