博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
自适应表格连续字符换行及单行溢出点点点显示
阅读量:4209 次
发布时间:2019-05-26

本文共 405 字,大约阅读时间需要 1 分钟。

我们应该都知道使用

这里写图片描述

让连续的英文数字字符换行显示

这里写图片描述

让单行文字超出的时候使用点点点表示

但是,如果是自适应的表格中,我们要实现上面两个效果,可能就会遇到挫折,你会发现屡试不爽的方法现在完全被无视了!

例如,连续的英文字符会撑开单元格,而无视其外部的宽度设置,类似下面截图效果

这里写图片描述

以及单行文字溢出点点点效果也会无效,因为单元格的流动性,会根据内容的变化而自动变化,使得文字变得根本就不存在溢出这种说法

如果解决这个问题呢?实际上很简单,给最外面的table标签增加一个声明:

这里写图片描述

table-layout: fixed的作用在于,让表格布局固定,也就是表格的宽度不是跟随单元格内容多少自动计算尺寸

这里写图片描述

以后,大家或多或少,或者已经开始使用表格相关display属性帮助构建web页面了,总会遇到类似的连续英文字符不换行,或者单行文字溢出没有效果的。此时,您就可以想到table-layout: fixed这厮来帮助解决问题了

这里写图片描述

你可能感兴趣的文章
九度OJ 1088:剩下的树 (线段树)
查看>>
九度OJ 1089:数字反转 (数字反转)
查看>>
九度OJ 1090:路径打印 (树、DFS)
查看>>
九度OJ 1091:棋盘游戏 (DP、BFS、DFS、剪枝)
查看>>
九度OJ 1092:Fibonacci (递归)
查看>>
九度OJ 1093:WERTYU (翻译)
查看>>
九度OJ 1094:String Matching(字符串匹配) (计数)
查看>>
九度OJ 1095:2的幂次方 (递归)
查看>>
九度OJ 1471-1480(10/10)
查看>>
九度OJ 1481-1490(7/10)
查看>>
九度OJ 1491-1500(5/10)
查看>>
九度OJ 1501-1510(10/10)
查看>>
业务系统中,报表统计功能如何组织--统计分析模块参考
查看>>
面向数据集成的ETL技术研究
查看>>
DataStage(ETL)技术总结 -- 介绍篇(转载)
查看>>
Greenplum技术浅析--vs oracle RAC
查看>>
框架一
查看>>
Oracle-内存管理解读
查看>>
Oracle-PFILE和SPFILE解读
查看>>
leetcode 13: Roman to Integer
查看>>