视码如命

html 页面中显示单行省略号

<!DOCTYPE html>
 
<html>
 
<head>
 
<meta charset="UTF-8">
 
<title>内容超出显示省略号</title>
 
<style>
 
.cont{
 
width:200px;
overflow: hidden;/*内容超出后隐藏*/
 
text-overflow: ellipsis;/* 超出内容显示为省略号*/
 
white-space: nowrap;/*文本不进行换行*/
 
}
 
</style>
 
</head>
 
<body>
 
<p class="cont">
 
订单的的顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶
 
顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶
 
</p>
 
</body>
 
</html>

posted on 2016-10-31 11:47  视码如命  阅读(3231)  评论(1编辑  收藏  举报

导航