css 内容溢出情况

内容溢出

text-overflow: ellipsis;
overflow: hidden;

display: inline-block;
width: 49px;
text-overflow: ellipsis;
overflow: hidden;

换行

在一个单元格中有内容，内容会自动撑开换行，这就导致行高不一致，所以对于操作宽度的内容，我们不让它换行（这回撑开单元格），并且让操作的部分以省略号的方式显示。
w3school white space property

当用户鼠标滑倒这个单元格时在显示出全部信息。html中标签都会有一个属性，title，可以用来显示完全的信息

codeopen span title显示

<span title="看到你想看的信息">鼠标放我这</span>

  <tr>
    <td title="查看我的全部信息">Ernst Handel</td>
    <td>Roland Mendel</td>
    <td>Austria</td>
  </tr>

如在elementui中的应用

   <el-table-column
     align="center"
     label="会员标签"
   >
    <template slot-scope="scope">
      <span :title="scope.row.userTag">{{scope.row.userShowTag}}</span>
    </template>
   </el-table-column>