当元素设置固定宽度之后,如果元素内的文本超出宽度之后将其设置为省略号效果的方法:
text-overflow 属性规定当文本溢出包含元素时发生的事情。
语法
text-overflow: clip|ellipsis|string;
值
描述
clip
修剪文本。
ellipsis
显示省略符号来代表被修剪的文本。
strin...
分类:
其他好文 时间:
2015-04-24 16:18:33
阅读次数:
96
想要在布局中显示一段新闻的标题或是内容,特别是内容,东西超多...下面的方法就是通过css来控制文本显示多少的:首先在html中写上:... 超多内容..... 之后开始设置css样式:.ellipsis { height: 3em; line-height: 1.5em; ...
分类:
Web程序 时间:
2015-04-18 13:03:23
阅读次数:
130
css样式:
max-width: 230px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display:block;
float:left;...
分类:
其他好文 时间:
2015-04-17 20:35:38
阅读次数:
146
大家应该都知道用text-overflow:ellipsis属性来实现单行文本的溢出显示省略号(…)。当然部分浏览器还需要加宽度width属性。以下是常规写法overflow: hidden;text-overflow: ellipsis;white-space: nowrap;但是这个属性并不支持...
分类:
其他好文 时间:
2015-04-15 11:00:26
阅读次数:
120
》单行文本的溢出显示省略号(…)text-overflow:ellipsis-----部分浏览器还需要加宽度width属性。overflow: hidden;text-overflow: ellipsis;white-space: nowrap;》多行文本溢出显示省略号WebKit浏览器或移动端的页...
分类:
其他好文 时间:
2015-04-15 10:57:00
阅读次数:
126
个人笔记1、word-break:break-all; 换行2、white-space:nowrap; overflow:hidden; text-overflow:ellipsis; 省略号3、固定高度1:html{height:100%;overflow:hidden;}body{margin:...
分类:
其他好文 时间:
2015-04-13 22:44:03
阅读次数:
154
1、单行文本溢出显示省略号的css写法1 overflow:hidden;2 text-overflow:ellipsis;3 white-space:nowrap;/*不换行*/2、多行文本显示省略号 这里根据应用场景来实现 1)Webkit浏览器或移动端页面 可以使用webkit的私有属性...
分类:
Web程序 时间:
2015-04-03 13:28:55
阅读次数:
176
1、一行文字自适应屏幕(不折行,隐藏多余文字,显示省略号) white-space: nowrap; text-overflow: ellipsis; overflow: hidden; 以上三个样式同时使用。
分类:
Web程序 时间:
2015-04-03 13:02:14
阅读次数:
133
ul li{ height:25px; line-height:25px; width:200px; overflow:hidden; white-space:nowrap;-moz-text-overflow:ellipsis; text-overflow:ellipsis; }注意以上几个的先后...
分类:
其他好文 时间:
2015-04-02 22:34:44
阅读次数:
130
所有主流浏览器都支持 text-overflow 属性。定义和用法text-overflow 属性规定当文本溢出包含元素时发生的事情。当然,这个属性需要跟overflow:hidden;一起来使用值描述clip修剪文本。ellipsis显示省略符号来代表被修剪的文本。最多的用法还是当内容大于宽度的时...
分类:
Web程序 时间:
2015-03-20 17:54:28
阅读次数:
172