table-layout:fixed 属性的解说
如果想要一个table固定大小,里面的文字强制换行(尤其是在一长串英文文本,并且中间无空格分隔的情况下),以达到使过长的文字不撑破表格的目的,一般是使用样式:table-layout:fixed。但是在Firefox下面,会有一些问题:firefox下,内容会飘出框外,暂时没有找到解决办法

例1:(IE浏览器)长串英文自动回行
方法:同时加入word-wrap:break-word;

table{table-layout:fixed;word-wrap:break-word;}

例2:(IE浏览器)一个表格里的内容隐藏
方法:使用样式table-layout:fixed与nowrap(一行一列)

<style>
.tbl {table-layout:fixed}
</style>
<table class="tbl" border=1 width=80>
<tr>
<td nowrap>abcdefghigklmnopqrstuvwxyz 1234567890</td>
</tr>
</table>
效果:

width=80起作用了,换行也被干掉了。

例3:(IE\Firefox浏览器)固定宽度使多余内容隐藏
方法:在使用百分比固定td大小情况下使用样式table-layout:fixed与nowrap,并且使用div (一行两列)

<style>
.tbl {table-layout:fixed}
.td {overflow:hidden;}
</style>
<table class="tbl" border=1 width=80>
<tr>
<td width=25% class="td" nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</td>
<td class="td" nowrap>
<div>abcdefghigklmnopqrstuvwxyz 1234567890</div>
</td>
</tr>
</table>

效果:

 
 

table-layout:fixed 属性的解说的更多相关文章

  1. ie8下table的colspan属性与max-with属性的显示错乱问题

    今天项目测试时发现了一个table的colspan样式问题,发现colspan单元格下的的元素设置max-with后将上面的第二列单元格撑开了,导致后面单元格的内容换行,先看代码: html代码: & ...

  2. table表格的属性

    border="1"----边框 cellpadding="10%"----单元边缘与其内容之间的空白距离 cellspacing="10%" ...

  3. css中table-layout:fixed 属性的用法

    table-layout:fixed 属性的用法:如果想要一个table固定大小,里面的文字强制换行(尤其是在一长串英文文本,并且中间无空格分隔的情况下),以达到使过长的文字 不撑破表格的目的,一般是 ...

  4. Android表格布局(Table Layout)

    Android表格布局(Table Layout) 先来看布局管理器之间继承关系图: 图1 可知TableLayout继承了LinearLayout,所以表格布局本质上依然是线性管理器. 表格布局采用 ...

  5. Delphi dbf文件如何定位记录(即设置Table的RecNum属性来移动到该记录号)

    Delphi的table的RecNum属性,可以用来定位记录,如:self.Table1.RecNum:=23;即可以让数据库记录移动到23号记录上,但这种作用仅限于Paradox数据库,而不是dBA ...

  6. 元素设置position:fixed属性后IE下宽度无法100%延伸

    元素设置position:fixed属性后IE下宽度无法100%延伸 IE bug 出现条件: 1.div1设置position:fixed属性,并且想要width:100%的效果. 2.div2(下 ...

  7. 解决IE6不支持position:fixed属性

    最近在优化网站浮动广告时候遇见了IE6不支持position:fixed属性.上网收集了一下解决方案 比较好的方案就是利用css表达式进行解决 补充:CSS Expression (CSS 表达式), ...

  8. Android--应用开发3(Android layout XML属性)

    Android layout XML属性 转载:http://www.cnblogs.com/playing/archive/2011/04/07/2008620.html Layout对于迅速的搭建 ...

  9. (转)实例详解CSS中position的fixed属性使用

    关于fixed属性,在什么情况下需要用,怎么用,首先,我们应该先了解下fixed属性的说明:fixed总是以body为定位时的对象,总是根据浏览器的窗口来进行元素的定位,通过"left&qu ...

随机推荐

  1. Codefoces 429 D. Tricky Function

    裸的近期点对.... D. Tricky Function time limit per test 2 seconds memory limit per test 256 megabytes inpu ...

  2. c# 轻量级ORM框架 实现(一)

    发布一个自己写的一个轻量级ORM框架,本框架设计期初基于三层架构.所以从命名上来看,了解三层的朋友会很好理解. 设计该框架的目的:不想重复的写增删改查,把精力放到功能实现上. 发布改框架的原因:希望给 ...

  3. Java学习笔记之继承

    一.继承的基础 在Java术语中,被继承的类叫超类(superclass)或者父类,继承超类的类叫子类(subclass). 举例说明: class Box { public double width ...

  4. BZOJ 1053: [HAOI2007]反素数ant dfs

    1053: [HAOI2007]反素数ant 题目连接: http://www.lydsy.com/JudgeOnline/problem.php?id=1053 Description 对于任何正整 ...

  5. TP复习10

    i * { padding:0; margin:0; } 居中 ## ThinkPHP 3.1.2 模板中的变量#讲师:赵桐正微博:http://weibo.com/zhaotongzheng 本节课 ...

  6. poj 1222 EXTENDED LIGHTS OUT(位运算+枚举)

    http://poj.org/problem?id=1222 题意:给一个确定的5*6放入矩阵.每一个格子都有一个开关和一盏灯,0表示灯没亮,1表示灯亮着.让你输出一个5*6的矩阵ans[i][j], ...

  7. LINUX 内存结构

    1.页框管理 Linux采用4KB页框大小作为标准的内存分配单元.内核必须记录每个页框的状态,这种状态信息保存在一个类型为page的页描述符中,所有的页描述存放在mem_map中.virt_to_pa ...

  8. 用PredicateBuilder实现Linq动态拼接查询

    在使用Linq查询的时候,特别是如果你在使用Entiry Framwork,有时会遇到动态查询的情况(客户的查询条件是不固定的拼接查询).我们能想到的第一方案应该是拼接SQL,的确这样是可以达到我们的 ...

  9. 为rm命令增加回收站功能

    rm是个强大的命令,特别是rm -rf有时候强大到让你欲哭无泪,当你想清除当前目录下的所有文件和目录时,很简单 $sudo rm -rf ./* 这没什么,但是,但是如果不小心打成这样 $sudo r ...

  10. iOS一分钟学会环形进度条

    有几篇博客写到了怎么实现环形进度条,大多是使用Core Graph来实现,实现比较麻烦且效率略低,只是一个小小的进度条而已,我们当然是用最简单而且效率高的方式来实现.先看一下这篇博客,博客地址:htt ...