有时候表格会因为内容多少忽大忽小的很烦人,在网上搜了下解决方案,效果不错哦,给大家分享下!
首先介绍两个利器:
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. Xpath,XQuery,DTD

    一.Xpath XPath 是一门在 XML 文档中查找信息的语言;XPath 是 XSLT 中的主要元素.XPath是W3C标准.1.七种类型节点:元素.属性.文本.命名空间.处理指令.注释.文档节 ...

  2. 树论讲解——最近公共祖先(lca)

    最近公共祖先?! 有人肯定要问:什么是最近公共祖先???!! 好那我们现在就来说说什么是最近公共祖先吧! 最近公共祖先有一个好听的名字叫——lca 这是一种算法,这个算法基于并查集和深度优先搜索.算法 ...

  3. Scrapy实战篇(八)之简书用户信息全站抓取

    相对于知乎而言,简书的用户信息并没有那么详细,知乎提供了包括学习,工作等在内的一系列用户信息接口,但是简书就没有那么慷慨了.但是即便如此,我们也试图抓取一些基本信息,进行简单地细分析,至少可以看一下, ...

  4. 【BZOJ 4665】 4665: 小w的喜糖 (DP+容斥)

    4665: 小w的喜糖 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 94  Solved: 53 Description 废话不多说,反正小w要发喜 ...

  5. 【BZOJ 4169】 4169: Lmc的游戏 (树形DP)

    4169: Lmc的游戏 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 44  Solved: 25 Description RHL有一天看到lmc在 ...

  6. 关于dp骗分

    1.样例2.搜索3.大小->贪心:<1>每次选代价最小的两个矩阵                      <2> 每次选最大....                   ...

  7. [jzyzoj2021]lca模板题

    查找最近公共祖先...我也不知道这东西有什么用,在线写法,非常之慢.... 存代码 #include<cstdio> #include<iostream> #include&l ...

  8. Problem E: 深入浅出学算法006-求不定方程的所有解

    Description 现有一方程ax+by=c,其中系数a.b.c均为整数,求符合条件的所有正整数解,要求按x由小到大排列,其中a b c 均为不大于1000的正整数 Input 多组测试数据,第一 ...

  9. hdu 3046 最小割

    每个栅栏其实就是一条边,修一些栅栏,使得狼不能抓到羊,其实就是求一个割,使得羊全在S中,狼全在T中. #include <cstdio> #include <cstring> ...

  10. [转]Android x86模拟器Intel Atom x86 System Image配置与使用方法

    Android x86模拟器Intel Atom x86 System Image配置与使用方法 前言: 大家现在开发使用的Android 模拟器模拟的是 ARM 的体系结构(arm-eabi),因此 ...