html table 知识点
-
第一点就是图片在表格中不能对齐边沿的问题,这是和浏览器的渲染模式相关的,在标准模式中是不能对齐的,除非改变CSS某些样式。而在准标准模式和怪异模式中,默认就是对齐的。
这一特性在以前的表格布局时代是大大的流行啊,比如使用透明图片撑大表格然后实现页面布局效果。由于现在大部分网站的doctype都是html5了,这会导致页面的渲染模式是标准模式,反而导致页面不对齐。 -
表格有一个css属性非常重要,就是table-layout,其默认值是auto,含义是根据内容自动实现表格的布局。这个时候设置表格的列宽是无效的。必须设置table-layout为fixed。
-
控制表格内容的溢出,需要设置表格table-layout: fixed; 然后设置td或者th元素white-space: nowrap;和overflow: hidden; 以上设置就可以实现IE和Firefox浏览器生效了。但是对于webkit浏览器,还需要设置table的width属性,否则还是没有效果。
-
其实控制表格内容溢出,最好的方式还是放一个span或者div在th或者td元素中,然后控制span或者div元素的溢出。
【推荐】还在用 ECharts 开发大屏?试试这款永久免费的开源 BI 工具!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步