CSS控制顯示多少行，是一個在頁面布局中非常常用的技巧。特別是在響應式設計中，為了適應不同設備的屏幕大小，我們需要通過CSS控制元素的行數來合理地布局頁面。下面將介紹如何通過CSS實現控制元素的顯示行數。

/* 定義元素高度 */
box {
height: 50px;
overflow: hidden;
}
/* 定義文本行數 */
box p {
display: -webkit-box;
-webkit-line-clamp: 2; /* 指定顯示行數 */
-webkit-box-orient: vertical;
overflow: hidden;
}

上面的代碼中，我們定義了一個高度為50px的元素box，并通過overflow: hidden;隱藏了超出元素范圍的內容。接著，通過box p選擇器，我們指定了box內的文本要顯示的行數，并通過display: -webkit-box;和-webkit-box-orient: vertical;將文本按照垂直方向排列。

值得注意的是，上述代碼中的-webkit-line-clamp屬性只適用于WebKit瀏覽器，如果要兼容其他瀏覽器，可以通過下面的代碼實現：

box p {
display: -webkit-box;
-webkit-line-clamp: 2; /* WebKit瀏覽器 */
-webkit-box-orient: vertical;
overflow: hidden;
line-height: 1.5em; /* 非WebKit瀏覽器 */
height: 3em; /* 非WebKit瀏覽器 */
}

在這段代碼中，我們通過line-height屬性指定了文本的行高，最后通過height屬性來限制文本的高度，從而達到控制顯示行數的效果。

總的來說，CSS控制顯示多少行是一個非常實用的技巧，可以讓頁面更加美觀和易讀。掌握這一技能，對于開發高質量的響應式設計頁面有很大幫助。