首页 > 技术文章 > css截取过长文本,省略号显示

javalinux 2021-05-18 10:54 原文

html代码片段

<li >
    <span class="cut">很长的内容很长的内容很长的内容很长的内容</span>
    <span style="float: right;">9秒前</span>
</li>

css样式代码

.cut{
    display: inline-block;        /*让span 标签变成行内标签但具有宽高属性*/
    white-space: nowrap;         /*文本不进行换行*/
    overflow: hidden;           /*隐藏溢出文本*/
    text-overflow: ellipsis;   /*多出文本使用 ....代替*/
    width: 50px;               /*宽度*/
}

 

 

推荐阅读