如何让p标签里文字不换行,以省略号结束

2024年03月27日 P标签显示省略号 P标签禁止换行 p标签里文字省略号 懒猪技术

有时候我们只需要页面显示一行内容,又不想改后端程序,又不想用JS截取,那么有什么简单的办法让p标签里文字不换行,以省略号结束呢?

小白实测只需要几行css就可以实现,悄悄告诉你,不止p标签可以用哦,其余用法小伙伴们自行测试

//一行
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;

//两行
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;

本文链接:http://so.lmcjl.com/news/513/

展开阅读全文
相关内容