[CSS] Display ellipsis beyond the length

element:

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

style: 

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

result:

Guess you like

Origin blog.csdn.net/ChaoChao66666/article/details/131204111