Question

HTML 表格单元格内容过长

怎么做到像图片中的效果，过长内容 不会撑破表格，用省略号显示，鼠标移动到单元格上面显示所有信息

Answer 1

1.给那个td加 text-overflow:ellipsis，和 white-space:nowrap 使td的内容不换行，超长出省略号。
2.鼠标hover上去显示全 最简单的方法给那个td一个title属性，属性值是全部内容 hover上去自动就有了，但不是图上的那种样子，不会有粗细，颜色之分，就是系统默认的。
3.如果想要图片上的那种效果 需要用js实现。写个隐藏div把那个td的内容放进去，然后onmouseover事件。

Answer 2

style="word-break:keep-all;/* 不换行 */white-space:nowrap;/* 不换行 */ overflow:hidden;/* 溢出隐藏 */text-overflow:ellipsis;/* 缺省超出部分以。。。代替显示 */"

Answer 3

http://www.w3school.com.cn/cssref/pr_pos_overflow.asp
overflow:hidden
内容溢出用(...)表示的数种方法
http://www.jsann.com/post/fand_text_overflow.html

Answer 4

$(function() {
$('table').find('td').mouseover(function() {
var cont = $(this).text(); // 获取到内容
});
});

Answer 5

div {
     overflow: hidden;
}