html 表格比较宽溢出的解决方法

时间:2021-05-08

表格如果比较宽,则有可能溢出。

比如有两个div,左和右。如果表格在右边的div中,但是它比较宽,则显示的时候很可能右边的div中没有显示,而是显示在了下边。此时只要规定这个表格的宽度即可:


复制代码代码如下:
<table style='width:85%'>

解决html表格中内容超出不强制换行和超出宽度自动隐藏并显示省略号

在表格布局中经常会遇到因为表格内容长短的变化导致布局混乱的情况,这个时候我们可能会有为了布局稳定把单元格宽度写死的情况;但是我们设置了宽度却发现超出了宽度之后会自动变大,用css定义元素的overflow:hidden;属性也不行;最后找的的解决方案如下:

table{ table-layout:fixed;}td{ width:100%; word-break:keep-all; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

如果担心隐藏了看不到完整的单元格内容建议在单元格上面加上title属性值就是单元格的完整内容这样只要鼠标经过就能显示全部了

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章