<! DOCTYPE html>
<meta charset= "UTF-8" >
<TITLE>HTML5 label </title>
<style>
p{
/**
White-space:nowrap; Indicates that the text will not wrap, continue on the same line, until the <br> tag is encountered;
Overflow:hidden; Do not display more than the object size of the content, is to put out the part of the hidden;
text-overflow:ellipsis; When the text object overflow is displayed ... and of course, the Set property is not displayed for clip point points;
-o-text-overflow: To be compatible with opera browser;
*/
width:200px;
Overflow:hidden;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
White-space:nowrap;
}
div{
/ * Text exceeds height not displayed * /
Overflow:hidden;
Display:block;
height:60px;
width:100px;
}
</style>
<body>
<p> This process is more friendly to search engines, because the title is not actually truncated, but is limited to the width and is not displayed. </p>
<div> This process is more friendly to search engines, because the title is not actually truncated, but is limited to the width and is not displayed. </div>
</body>
CSS text overflow display ellipsis