时间:2021-05-08
为了让表格能够填充屏幕(剩余空白区域),常将其宽度属性定义为:100%,单元格也是用百分数来定义。
但这样就会出现问题: 如果单元格中的文本超过宽度限制,就会自动换行,高度自动增高,导致整个表格的样式参差不齐,很难看。
很容易想到的解决方法是,禁用文本换行: white-space:nowrap; overflow:hidden;
So easy! 但效果仍然出乎意料:文本全部在一行显示,宽度自动加宽,甚至还超出了父容器,overflow完全没有起作用!
怎么回事? 百分比的原因么? 但是如果使用静态的固定宽度,就失去了表格的灵活性。
于是乎,不费吹飞之力地找到了终极解决方案: 固定表格宽度: table-layout: fixed;
顺便做了个简易的效果图,参考下:
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
前言:今天来和大家详细说一下table-layout属性的用法。table{table-layout:fixed;}***本文关键
csstable超出隐藏table{width:*;table-layout:fixed;}td{white-space:nowrap;overflow:hid
附上两个我经常使用的table样式:复制代码代码如下:body,table{font-size:12px;}table{table-layout:fixed;e
word-break:keep-all;字体不断开table-layout:fixed;列宽由表格宽度和列宽度设定,默认由表格的内容决定列宽。white-spa
1、在编辑列里面,直接就有设置列宽度的!如果你不想单元格的内容把单元格撑大,那么就加一个样式table{table-layout:fixed},意思就是每列都固