在页面中显示超长字符会换行，影响页面美观，需要将超出长度的部分隐藏，实现代码如下：
<html>
<head>
<title>Demo</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<style type="text/css">
.title{width:200px;white-space:nowrap;overflow:hidden;text-overflow : ellipsis}
.title:hover {white-space:normal; background:#e3e3e3;}
</style>
</head>
<body>
<div class=title>页面中解决内容显示太长省略多余部分并加省略号的样式
以上显示内容在超过样式定义的200px宽度后,后面的字符将被…替换.</div>
</body>
</html>clip:当对象内文本溢出时将溢出部分裁剪。
elipsis:当对象文本溢出时将溢出部分用省略号标记。
text-overflow属性仅是注解，当文本溢出时是否显示省略标记。并不具备其它的样式属性定义。
要实现溢出时产生省略号的效果还须定义：强制文本在一行内显示（white-space:nowrap）及溢出内容为
隐藏（overflow:hidden），只有这样才能实现溢出文本显示省略号的效果。
3443
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
