本文主要是介绍css——文本强制两行超出就显示省略号,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
1. 强制一行的情况很简单
overflow:hidden;//超出的隐藏
text-overflow:ellipsis;//省略号
white-space:nowrap;//强制一行显示
2. 如果要强制两行的话,得用到css3的知识
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
在实际项目中,我们会发现-webkit-box-orient没有生效,需要加入如下注释
/*! autoprefixer: off */
最终代码:
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow:hidden;
/*! autoprefixer: off */
-webkit-box-orient: vertical;
这篇关于css——文本强制两行超出就显示省略号的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!