有时候表格会因为内容多少忽大忽小的很烦人,在网上搜了下解决方案,效果不错哦,给大家分享下!
首先介绍两个利器:
table-layout:fixed //固定表格大小
word-break:break-all;//字符串自动换行
 
注意:IE和firefox是有很大区别的!(我就是栽在这个上面了,⊙﹏⊙b汗)
1. (IE浏览器)使用 table-layout:fixed;强制table的宽度,多余内容隐藏
<table style="table-layout:fixed" width="200">
 
2.(IE浏览器)使用 table-layout:fixed;强制table的宽度,内层td,th采用word-break : break-all;或者word-wrap : break-word ;换行
<table width="200" style="table-layout:fixed;">
<tr>
<td width="25%" style="word-break : break-all; ">abcdefghigklmnopqrstuvwxyz 1234567890
 
3.(Firefox浏览器)连续的英文字符和阿拉伯数字的断行,Firefox的所有版本的没有解决这个问题,我们只有让超出边界的字符隐藏或者,给容器添加滚动条
 
4.(Firefox浏览器)使用 table-layout:fixed;强制table的宽度,内层td,th采用word-break : break-all;或者word-wrap : break-word ;换行,使用overflow:hidden;隐藏超出内容,这里overflow:auto;无法起作用
<table style="table-layout:fixed" width="200">
<tr>
<td width="25%" style="word-break : break-all; overflow:hidden; ">abcdefghigklmnopqrstuvwxyz1234567890</td>

html表格内容自动换行的更多相关文章

  1. table表格td内内容自动换行

    项目开发时,遇到问题:td内传入数据,全是字母,不会自动换行 一般字母数字/特殊符号的话,会被浏览器默认是一个字符串或者说一个单词,不会自动换行 所以需要设置一下,让表格内容自动换行. 1.给td标签 ...

  2. DIV的内容自动换行

    word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行. 它们的区别就在于: 1,word-break:break-all 例如div宽 ...

  3. css中设置table中的td内容自动换行

    word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行. 它们的区别就在于: 1,word-break:break-all 例如div宽 ...

  4. php网址显示excel表格内容

    /** * excel表格内容在网页中显示 * * 首先需要下载PHPExcel 工具包 * 网址: http://phpexcel.codeplex.com/releases/view/119187 ...

  5. 转!!Java JTable 根据表格内容 自动调整表格列宽

    //根据表格内容 自动调整列宽http://blog.sina.com.cn/s/blog_5e54d6140100s1d3.html

  6. 使pre的内容自动换行

    <pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...

  7. [HTML Q&A][转]使pre的内容自动换行

    <pre> 元素可定义预格式化的文本.被包围在 pre 元素中的文本通常会保留空格和换行符.而文本也会呈现为等宽字体. <pre> 标签的一个常见应用就是用来表示计算机的源代码 ...

  8. JXL解析Excel表格内容到数据库

    java中常用的解析Excel表格的工具一种是POI一种是JXL,POI功能强大,相比JXL稍嫌复杂,对表格样式的处理非常好:而JXL解析简单方便,对中文支持比较好. 工作中解析Excel内容上传到数 ...

  9. python读取word表格内容(1)

    1.首页介绍下word表格内容,实例如下: 每两个表格后面是一个合并的单元格

随机推荐

  1. ubuntu下 pycharm使用andcoda下的tensorflow

    在ubuntu中 tensorflow是安装在andconda里的一个虚拟环境中,他就相当于一个容器,将tensorflow的整个环境去模拟隔离出来,因为我们直接使用andconda库去作为pycha ...

  2. 洛谷P2323 [HNOI2006] 公路修建问题 [二分答案,生成树]

    题目传送门 公路修建问题 题目描述 OI island是一个非常漂亮的岛屿,自开发以来,到这儿来旅游的人很多.然而,由于该岛屿刚刚开发不久,所以那里的交通情况还是很糟糕.所以,OIER Associa ...

  3. Spring boot的hot swapping

    前言 嘛,都是看官方文档的,就先贴上文档地址: using-boot-hot-swapping 使用 使用hot swapping只需要把devtools的jar包添加到你的classpath里. 在 ...

  4. 小数据池,bytes

    '''python2 python3 '''#python2#print() print 'abc'#range() xrange() 生成器# raw_input() #python3#print( ...

  5. Hibernate 悲观锁(Pessimistic Locking)

    在日常开发中并发应该是比较常遇到的业务场景,Hibernate给我们提供了并发操作,接下来简单介绍一下Hibernate悲观控制. 悲观锁:用户其实并不需要花很多精力去担心锁定策略的问题,通常情况下, ...

  6. appengine 云计算。 部署web网络。

    韩梦飞沙  韩亚飞  313134555@qq.com  yue31313  han_meng_fei_sha appengine 可以 不用手动启动像服务器. 在eclipse中 这两个sdk 配好 ...

  7. luoguP3978 [TJOI2015]概率论 卡特兰数

    考虑分别求出$f_n, g_n$表示$n$个点的有根二叉树的数量和$n$个点的所有情况下有根二叉树的叶子结点的总数 有$f_n = \sum_{k} f_k * f_{n - 1 - k}$,因此有$ ...

  8. [BZOJ4196][NOI2015]软件包管理器(树链剖分)

    4196: [Noi2015]软件包管理器 Time Limit: 10 Sec  Memory Limit: 512 MBSubmit: 2166  Solved: 1253[Submit][Sta ...

  9. HDU5904 LCIS 水题

    http://acm.hdu.edu.cn/showproblem.php?pid=5904:// 说是LCIS其实和LCIS没有一点儿关系的水题. 代码 #include<cstdio> ...

  10. 【BZOJ】2002: [Hnoi2010]Bounce 弹飞绵羊

    2002: [Hnoi2010]Bounce 弹飞绵羊 Time Limit: 10 Sec  Memory Limit: 259 MBSubmit: 14802  Solved: 7507[Subm ...