1. 常遇到span标签中中文和数字会换行的情况，如下：
这个时候个标签设置 word-break 属性即可
word-break属性
2. 在使用span 或 p标签时，字体经常会溢出父级div或者字数太多，这个时候就需要溢出省略号显示了
- 加上下面代码即可
.class-name {
word-break: break-all;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1; // 数字代表文字需要显示几行
}
- 再加上title效果更加
<span class="class-name" :title="className">
{{ className }}
</span>
