Single omit

.text_overflow{
    width:66em; // The maximum length can be displayedwhite-space:nowrap; // Text does not wrap unless <br/> is encounteredtext-overflow:ellipsis; // Display ellipsis to represent the clipped textoverflow:hidden; // overflow hide}Copy the code

Multi-line omit

.text_overflow{// Good compatibilitywidth: 66em;
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

Copy the code

References:

white-space:

value describe
normal The default. Whitespace is ignored by the browser
pre Whitespace is reserved by the browser. The behavior is similar to that in HTML<pre>The label
nowrap Text does not wrap, and text continues on the same line until encountered<br/>Label so far
pre-wrap Preserve the whitespace sequence, but wrap lines normally
pre-line Merges whitespace sequences, but keeps newlines
inherit Specifies that the value of the white-space attribute should be inherited from the parent element

text-overflow:

value describe
clip Trim the text
ellipsis Displays ellipsis to represent clipped text
string Uses the given string to represent the trimmed text