前端菜鸟折腾了一天,被测试打回好几次。。。。。。。。。。。
关键词:
table-layout:fixed;设置高度;固定高度;悬停;"white-space": 'nowrap',"text-overflow": 'ellipsis',"overflow": 'hidden'
网上有很多关于bootstrap table 设置td宽度,内容超出部分异常,悬停显示全部的方案。
但是几乎都有共同的冲突和问题
1、必须设置table table-layout:fixed;
但是和设置表格高度冲突,会导致表格不对齐
2、设置td的宽度无效
3。、、、、、、、
解决方案:
第一种、去掉表格高度设置、
第二种、亲测一种方案可实现需求,也可设置高度
1、不需要table-layout:fixed
2、设置td宽度和css
貌似td宽度可不设置
貌似真正起作用的就是"white-space": 'nowrap'
function formatTableUnit(value, row, index) {
return {
css: {
"white-space": 'nowrap',
"text-overflow": 'ellipsis',
"overflow": 'hidden'
}
}
}
3、让td返回包裹一层span(也可多个),设置宽度等于td宽度(title 实现悬停)
貌似td宽度可不设置。设置span宽度即可
"<span style='width: 120px; display:inline-block;text-decoration:underline;margin-top:2px;color: blue' title='"+val.showname+"' href='javascript:void(0)' οnclick=\"downloadFile('"+val.filename+"','"+val.showname+"')\">"+val.showname+"</span>"