Div内部的内容超出部分显示省略号(仅仅只有一行内容)
效果如下:
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内部的内容超出部分显示省略号(仅仅只有一行内容)的更多相关文章
- DIV内容超出长度显示省略号,鼠标移上自动显示全部内容(EasyUI DataGrid)
如果想把DIV中超出的文本显示成省略号,而不是换行全部显示,有2个办法. 注:本文主要是以EasyUI的DataGrid为案例的,如果是其他场景只要底层是用DIV显示文本的应该都能使用. 首先可以给此 ...
- css设置内容超出后显示省略号
1.使用overflow: hidden把超出的内容进行隐藏: 2.然后使用white-space: nowrap设置内容不换行: 3.最后使用text-overflow: ellipsis设置超出内 ...
- HTML5 元素文字超出部分显示省略号(支持多行),兼容几乎所有常用浏览器
1,公共样式,在公共的 CSS 文件中加入以下内容 /* 超出部分显示省略号,支持多行 */ .text-ells:before { content: ''; float: left; width: ...
- css 超出部分显示省略号
代码: overflow: hidden; white-space: nowrap; text-overflow: ellipsis; 重点代码:text-overflow: ellipsis; 解 ...
- JS控制文字只显示两行,超出部分显示省略号
由于使用css控制文字只显示多行,超出部分显示省略号,存在一定的兼容性问题,所以总结了一下网上一些大咖使用js实现控制行数的解决方案. 第一步:依次引入jquery.js+jquery.ellipsi ...
- Table组件设置文字超出宽度显示省略号,鼠标悬停以悬浮框显示
一.设置文字超出宽度显示省略号 注意点: 1. 需要指定column的width属性,否则列头跟内容可能不对齐.需要留一列不设置宽度以适应弹性布局. 2. 列宽度width必须大于ellipsis的 ...
- css文字超出自动显示省略号
只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...
- CSS——文本超出隐藏显示省略号
文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...
- CSS实现单行、多行文本超出部分显示省略号
单行文本超出,代码如下: css代码: <style> .one{ width:200px; overflow: hidden; text-overflow:ellipsis; whit ...
随机推荐
- 去除tabbar的灰线
去掉导航栏的边界灰线 [self.navigationController.navigationBar setBackgroundImage:[[UIImage alloc] init] forBar ...
- 2013成都Regional:一块木板,几个气球
先来看木板: 再来看气球: 最后看木板+气球: google送的纪念品.... 到现在还没敢打乱: 赛场外面.... 赛场里面: 和比赛时出了问题,并现场换了一台的电脑(对面长安大学1队)... 最 ...
- UI第四节——UIImageView详解
- (void)viewDidLoad { // super调用是必须的 [super viewDidLoad]; UIImage *image = [UIImage imageNamed:@&quo ...
- 关于hibernate链接数据源的配置参数详细解释(转)
具体使用方法还可以参考以下地址: http://blog.csdn.net/xb12369/article/details/41517409 以下信息转自: http://baike.baidu.co ...
- C#第一次的Hello World
这个Hello World是最基础的,在程序默认生成的using System下,不用自己可以的去写using System. 我们要牢记compling and running和running wi ...
- Inno Setup制作应用程序安装包
我最近写了一个MFC应用程序,想发给其他的小伙伴玩一玩,直接发了个exe文件过去,结果发现小伙伴那边打不开.原来这个exe文件虽然是MFC静态编译的,但是还依赖了其他几个.dll文件,需要把这几个dl ...
- css小常识
static:对象遵循常规流.此时4个定位偏移属性不会被应用(即 没有声明position:relative, top.right.bottom.left不管用). 当position的值为非stat ...
- Effective Java 读书笔记之四 泛型
泛型的本质是参数化类型.只对编译器有效. 一.请不要在新代码中使用原生态类型 1.泛型类和接口统称为泛型,有一个对应的原生态类型. 2.原生类型的存在是为了移植兼容性. 3.无限制通配类型和原生态类型 ...
- [Unity3d][NGUI]打包NGUI预制件成Assetbundle 两种思路.
http://www.58player.com/blog-2537-85030.html 接上文,项目中因为需要UI热更新,所以我使用了AssetBundle这个解决方案. ...
- 《C和指针(Pointer on c)》 学习笔记(转自:http://dsqiu.iteye.com/blog/1687944)
首先本文是对参考中三个连接的博客进行的整理,非常感谢三位博主的努力,每次都感叹网友的力量实在太强大了…… 第一章 快速上手 1. 在C语言中用/*和*/来注释掉这段代码,这个实际上并不是十分的安全, ...