css——文本强制两行超出就显示省略号

本文主要是介绍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——文本强制两行超出就显示省略号的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---