要在表格单元溢出时用省略号剪切文本,您需要
max-width在每个
td类上设置CSS属性,以使溢出起作用。不需要额外的布局div
td { max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}对于响应式布局;使用
max-widthCSS属性指定列的有效最小宽度,或仅
max-width:0;用于无限的灵活性。此外,包含表将需要特定的宽度,通常为
width: 100%;,列的宽度通常设置为总宽度的百分比
table { width: 100%;}td { max-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}td.columnA { width: 30%;}td.columnB { width: 70%;}历史记录:对于IE 9(或更低版本),您需要在HTML中添加它,以解决特定于IE的呈现问题
<!--[if IE]><style> table { table-layout: fixed; width: 100px; }</style><![endif]-->


