码迷,mamicode.com
首页 > Web开发 > 详细

使用CSS让多出来的字变为省略号

时间:2016-07-15 23:48:36      阅读:247      评论:0      收藏:0      [点我收藏+]

标签:

<style>
.text1 {
  width:200px;
  overflow:hidden;
  text-overflow:ellipsis;
  -o-text-overflow:ellipsis;
  -webkit-text-overflow:ellipsis;
  -moz-text-overflow:ellipsis;
  white-space:nowrap;
}
.text2 {
  width:200px;
  word-break:break-all;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
</style>
 
<div class="text1">热卖精选:从子频道(服饰鞋包,亲子,居家,美妆)档期里面挑选出来,库存大于30%的高信价比商品list,数量为50个</div>
 
<br />
 
<div class="text2">热卖精选:从子频道(服饰鞋包,亲子,居家,美妆)档期里面挑选出来,库存大于30%的高信价比商品list,数量为50个</div>

上图Demo的效果如下:
技术分享

使用CSS让多出来的字变为省略号

标签:

原文地址:http://www.cnblogs.com/fireworld/p/5674612.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!