【CSS】超出长度显示省略号

元素：

<span class="spanText">{
   
   {accompanyingSample}}</span>

样式： 

.spanText {
    width: 100px;
    color: #80ffff;
    display: inline-block;
    white-space: normal;
    overflow: hidden; /*超出的文本隐藏*/
    text-overflow: ellipsis; /* 溢出用省略号*/
    vertical-align: top; //设置基准线，解决display inline-block造成的错位问题
  }

结果：