IE8/9 使用text-overflow: ellipsis 做块元素超长内容变

当前位置 : 首页 > 网页制作 > CSS > IE8/9 使用text-overflow: ellipsis 做块元素超长内容变

IE8/9 使用text-overflow: ellipsis 做块元素超长内容变

来源: 作者: 时间:2015-11-18 11:58
用的时候听说IE8不支持text-overflow: ellipsis;实战告诉我,其实还是支持的,不过都是有条件的
用的时候听说IE8不支持text-overflow: ellipsis;实战告诉我,其实还是支持的,不过都是有条件的
首先平时用的时候要配合

复制代码
代码如下:

overflow: hidden;
white-space: nowrap;

这两个属性让起溢出隐藏和不换行,然后IE8用的时候记得不要加

复制代码
代码如下:

word-berak:break-all;
word-wrap:break-word;

这样断开了,在IE8里面是不会变成省略号的(但是在IE6/7/FF/Chrome都没有问题),其实都单行省略了,本来也没有必要断词~-_-!

所以一般标准组合就是:

复制代码
代码如下:

overflow: hidden;
white-space: nowrap;
-o-text-overflow: ellipsis; /* for Opera */
text-overflow: ellipsis; /* for IE */

基本通杀所有浏览器了~

哦,对了,忘了说,像<a>这类默认非块的元素,要加上display:block;才有效果哦`,..嗯嗯,别忘了width或者max-width.
Tag:
网友评论

<