CSS中的多行內容截取大概就是將超出一定長度的文本內容省略號或其他符號代替，以優(yōu)化頁面布局和用戶體驗等方面的問題。以下是三種以CSS控制多行內容截取的方法。

1. 使用text-overflow屬性

.ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

上述代碼設置了white-space屬性為nowrap，意味著禁止文本換行；overflow屬性為hidden，即隱藏從容器外溢出的文本內容；最后使用text-overflow屬性來指定省略號的形式。

2. 使用line-clamp屬性

.clamp {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}

這段代碼是通過調用早期CSS的Webkit內核特有標簽表示的，通過指定display屬性為-webkit-box，-webkit-box-orient屬性為vertical，可以將truncation到第二行以后的文本內容全部隱藏；-webkit-line-clamp屬性設置一段文本需要顯示的行數(shù)（這里設置為2行）；最后使用overflow:hidden屬性來完整隱藏最后的截斷內容。

3. 使用calc計算屬性

.widthlimit {
width: calc(50%-30px);
}
.ellipsis {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}

這段代碼可以將文本內容截斷在規(guī)定寬度之內并在多余部分處使用省略號代替。首先設置一個容器的寬度，例如在上面的代碼中容器的寬度為50%，然后減去文本不變的寬度30px。然后使用text-overflow屬性來指定省略號的形式；overflow屬性將超出文本的部分全部隱藏；white-space屬性指定文本的處理方式，nowrap即禁止換行。