有时候我们只需要页面显示一行内容,又不想改后端程序,又不想用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;
THE END

本站部分文章搜集整理于互联网或者网友提供,如有侵权请联系站长

如若转载,请注明出处:https://htmlbk.com/web/603.html

温馨提示:该文档最后一次修改时间为2022-03-30 11:38:32,请注意相关的内容是否还可用!