text-overflow是CSS3的一个属性，其作用是当文本溢出包含它的元素时，应该裁剪还是将多余的字符用省略号来表示。
该属性一般和overflow:hidden属性一起使用。
text-overflow: clip|ellipsis|string
语法 text-overflow: clip|ellipsis|string;
clip 修剪文本
ellipsis 使用省略号来代表修剪的文本
string 使用给定的字符串来代表被修剪的文本
white-space:nowrap; //段落中文字不换行
text-overflow: ellipsis; // 多出的内容省略号...
overflow:hidden; //是让多出的内容隐藏起来
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.dd{
width: 150px;
height: 30px;
border: 1px solid darkcyan;
}
.dd p{
font-size: 15px;
margin: 0 auto;
white-space:nowrap; /*强制不换行*/
text-overflow:ellipsis; /*多出的内容省略号...*/
overflow:hidden; /*多出的内容隐藏起来*/
}
</style>
</head>
<body>
<div class="dd">
<p>当文本溢出时，用省略号代替溢出的文本</p>
</div>
</body>
</html>
原文链接：https://www.qiquanji.com/post/8702.html
本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。
微信扫码关注
更新实时通知