微信小程序文字控制單行超過顯示省略號
發布時間：2021-07-09 10:02 所屬欄目：小程序開發教程
在小程序開發過程中，經常會遇到一些數據無法在text中完全展示，所以會使用到隱藏相關文字，并在后方加上省略號(...)。
只需要在對應的text中設置下面的css就可以了。
overflow:hidden; //超出一行文字自動隱藏 text-overflow:ellipsis; //文字隱藏后添加省略號 white-space:nowrap; //強制不換行 |
不過上面的css只能保證單行顯示隱藏，如果想要2，3，n行隱藏呢？這個要求其實也是可以通過css做到的。下面貼出css：
display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; white-space: normal !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; |
只要改變其中-webkit-line-clamp的數字，就可以實現對應的需求了。
