热门推荐
立即入驻

css行内文本超出显示省略号或显示固定超出部分省略

前端1年前 (2022)更新 达西克
2K 0 0
  • 文本不换行,将超出一行以外的内替换成…
    /*文本不换行,这样超出一行的部分被截取,显示...*/
    .line-limit-length {
    width: 200px;
    overflow:hidden;
    text-overflow:ellipsis;
    background: goldenrod;
    white-space: nowrap;/*加宽度width属来兼容部分浏览*/
    }
  • 文本超过指定行数就替换成…,这里以3行为例
    .show-text-line-3{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    }
  • 加入样式后效果如下
    css行内文本超出显示省略号或显示固定超出部分省略
© 版权声明

相关文章

暂无评论

暂无评论...