This attribute uses a lot of thieves, I always forget, today to record

Single line text displays ellipsis

.a{
   overflow:hidden; /* The excess part is hidden. * / 
   white-space:nowrap;/* Do not wrap text, display */ on one line
   text-overflow:ellipsis;/* Out of display... * /
}
Copy the code

Multiple lines of text beyond display ellipsis

– WebKit – is the webKit kernel prefix (Chrome)


 .a{
    overflow: hidden;
 
    text-overflow: ellipsis;
 
    display: -webkit-box;/* Display objects as elastic stretchable box models */
 
    -webkit-line-clamp:2 ;/* Limits the number of lines in the block element text, which requires the combination of other WebKit attributes */
 
    -webkit-box-orient:vertical;/* Sets the arrangement of the box's children */
}
Copy the code

A final note:

WebKit CSS extension properties can be used directly in WebKit browsers or mobile devices (mostly webKit-powered browsers)

Text-overflow: Sets the effect of 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.