前端文字溢出

在开发时候，后端传给我们一些文字进行渲染，一些标题性的单行文字，当达到一定宽度就会溢出不显示并以点点点来显示。(类似下图效果的实现


先看下我们需要实现什么：

1、宽度设置
2、溢出的处理
3、溢出部分用点点点来代替

.p1 {
            width: 500px;
            height: 50px;
            line-height: 50px;
            font-size: 24px;
            font-weight: bold;
            border: 1px solid black;
			
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
<p class="p1">两战13中4！国产詹姆斯已成高薪低能？他还远没到爆发的时候</p>

实现效果如图