码迷,mamicode.com
首页 > 其他好文 > 详细

Div内部的内容超出部分显示省略号(仅仅只有一行内容)

时间:2015-07-17 13:30:30      阅读:177      评论:0      收藏:0      [点我收藏+]

标签:

效果如下:

技术分享

css代码:

overflow:hidden;
white-space: nowrap;
text-overflow:ellipsis;

解释:简单理解就是我要把文本限制在一行(white-space: nowrap;),肯定这一行是有限制的(width),并且你的溢出的部分要隐藏起来(overflow: hidden;),然后出现省略号( text-overflow: ellipsis)。

text-ellipsis是一个特殊的样式,有关解释是这样的:text-overflow属性仅是注解,当文本溢出时是否显示省略标记。并不具备其它 的样式属性定义。要实现溢出时产生省略号的效果还须定义:强制文本在一行内显示(white-space:nowrap)及溢出内容为隐藏 (overflow:hidden),只有这样才能实现溢出文本显示省略号的效果。

Div内部的内容超出部分显示省略号(仅仅只有一行内容)

标签:

原文地址:http://www.cnblogs.com/LoveQin/p/4653945.html

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