tbale文字超出显示省略号
代码很简单,一个简单表格
设置表格的样式table-layout:"fixed"再设置表格的宽度(这步必须)设置文字过长部分需要用到text-overflow标签,设置为 ellipsis,意思为文本超出部分为省略号;设置整体为本过长需要用white-space标签,设置为 nowrap,意思是文本不换行;同时需要设置整体标签超出部分为不显示,设置方法为:overflow: hidden;这样就ok了!<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title></head><style>table{table-layout: fixed;width: 100%;}</style><body><table border="1px"><tr id="test" ><td>姓名</td><td>年龄</td><td>性别</td><td>简介</td></tr><tr><td>大表格</td><td>23</td><td>男</td><td style="text-overflow:ellipsis; white-space: nowrap; overflow: hidden; ">首先设置表格的样式table-layout:"fixed"再设置表格的宽度(这步必须)在设置文字过长部分需要用到text-overflow标签,设置为 ellipsis,意思为文本超出部分为省略号;同设置整体为本过长需要用white-space标签,设置为 nowrap,意思是文本不换行;同时需要设置整体标签超出部分为不显示,设置方法为:overflow: hidden;整体设置标签为:td {text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }</td></tr></table></body></html>
图片