CCS3属性之text-overflow:ellipsis;的用法和注意之处

CCS3属性之text-overflow:ellipsis;的用法和注意之处
语法：

text-overflow：clip | ellipsis

默认值：clip

适用于：所有元素

clip： 当对象内文本溢出时不显示省略标记（…），而是将溢出的部分裁切掉。
ellipsis： 当对象内文本溢出时显示省略标记（…）。

在使用的时候，有时候发现不会出现省略标记效果，经过测试发现，使用ellipsis的时候，必须配合overflow:hidden; white-space:nowrap; width:50%;这三个样式共同使用才会有效果，示例代码：

<style type="text/css">
    .test{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:150px;}
</style>

<div class="test">关于**产品的推广关于**产品的推广关于**产品的推广</div>

上面的width属性根据实际需要填写，其它样式是固定的。（兼容IE7+）

转载于：http://www.tea119.com 代码改变世界，我的《源代码》，我的世界！（来源： http://www.cnblogs.com/wshiqtb/p/3144713.html）

以上是单行省略写法，多行省略写法如下：
1.支持谷歌最新浏览器
因为Webkit引擎里提供了一个控制多行文本超出溢出控制显示CSS属性：-webkit-line-clamp: N;：

.giveMeEllipsis {
    overflow: hidden;
    text-overflow: ellipsis; 
    display: -webkit-box; 
    -webkit-box-orient: vertical; 
    -webkit-line-clamp: N; /* 控制显示的行数 */ 
    line-height: X;        /* 对不支持浏览器的 */ 
    max-height: X*N;       /* 对不支持浏览器的弥补 */ 
}

（来源： http://www.webhek.com/text-overflow）