The front-end css text single line and two lines beyond become an ellipsis solution @莫成尘

Look at the code first, just copy and use it. The CSS style itself provides a lot of capabilities, but I still think that many front-end developers are not proficient in studying CSS. Here is a demo that goes beyond the hidden, so you can easily deal with it. (You will see the following effects)

Two lines omitted

word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
line-height: 50px;/* 需要注意的是 如果是两行省略 需要添加比如
 line-height或者其他属性老保证这两行文字站位高度为盒子高度的一半 */
width: 500px;
height: 100px;

Single-line omission

white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 500px;
height: 100px;

The above is the characteristics beyond the omitted attribute.
For other questions about CSS or the places you don't understand this method, you can leave a message, I will reply and help you solve it as soon as possible.