[css] 实现表头文字溢出省略号

思否上文本样式用不习惯，同步更新到自己的语雀，可以移步
https://www.yuque.com/diracke...

实现方式主要利用了css属性 text-overflow，设置溢出样式为 ... 。

.header-ellipsis {
white-space: nowrap;
text-overflow: ellipsis;
}

设置white-space: nowrap; 使得文本无法换行，单行过长溢出。（文本换行，没有溢出效果）

设置text-overflow 设置溢出样式，可选值及对应效果如下。

1、如果希望对一张表中的每一个表头都做表头文字溢出样式的处理，那么用在表头单元格样式上加上这个样式就可以实现效果。
（对el-table，用深度选择器选中el-table的样式::v-deep .el-table th .cell 加上white-space: nowrap;
及text-overflow: ellipsis;）

2、如果希望对表中的一个单元格实现这个效果，可以使用vue的插槽，在插槽中修改样式。
（以el-table为例
<el-table-column>
<template v-slot:header slot-scope="{ column, $index }" >
<span class="header-ellipsis">{{column.label}}</span>
</template>
</el-table-column>
）