在CSS中,我們可以通過設置自動換行屬性來控制文本顯示的方式。當文本內容超過單行寬度時,會默認換行顯示。但是,如果我們希望文本只顯示兩行,該怎么辦呢?
.text{ display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
為了實現只顯示兩行文本內容的效果,我們可以使用CSS3中的-webkit-line-clamp屬性。通過該屬性,我們可以指定文本內容只顯示指定的行數。同時,結合display: -webkit-box和-webkit-box-orient: vertical屬性,可以使得文本垂直方向的顯示方式為從上到下。最后,我們需要再加上overflow: hidden屬性,以防止多余文本內容的出現。