1.css代码，放在<style>标签里
table {table-layout: fixed; /* 只有定义了表格的布局算法为fixed，下面td的定义才能起作用。 */}table td {position: relative;/*width: 80px;*/height: 20px;text-align: center;font-weight: normal;width: 100%;word-break: keep-all; /* 不换行 */white-space: nowrap; /* 不换行 */overflow: hidden; /* 内容超出宽度时隐藏超出部分的内容 */text-overflow: ellipsis; /* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/}table td:hover {overflow: visible;/* 显示 */white-space: normal;/* 允许文字自动换行 */word-wrap: break-word;/* 文字自动换行 */}
2.效果图
第一条为鼠标悬停的时显示的数据，第二、三条为隐藏时的样式。
3.注意事项：
这里需要注意的一点table td:hover，如果不进行文字自动换行的设置，文字会默认在同一行进行显示
table td:hover{overflow: visible;/* 显示 */}
效果如下：
