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. corner2

    Original: https://github.com/LondonX/corner2 Backup: https://github.com/eltld/corner2

  2. python time模块详解(转)

    python 的内嵌time模板翻译及说明  一.简介   time模块提供各种操作时间的函数  说明:一般有两种表示时间的方式:       第一种是时间戳的方式(相对于1970.1.1 00:00 ...

  3. MYSQL: Handler_read_%参数说明

      环境: 表t_feed_idx(user_id bigint, feed_id bigint, KEY (`user_id`,`feed_id`)) engine=innodb;表t_feed_i ...

  4. iOS iphone5屏幕适配 autosizing

    转自:http://blog.sina.com.cn/s/blog_a843a8850101jxhh.html iphone5出来了,从不用适配的我们也要像android一样适配不同分辨率的屏幕了. ...

  5. Drawable和Bitmap转换

    一.Bitmap转Drawable Bitmap mBitMap=getYourBitMap(); //getYourBitMap()是你获取BitMap的方法 BitmapDrawable mBit ...

  6. 关于子线程使用Toast报错Can't create handler inside thread that has not called Looper.prepare()的解决办法

    形同如下代码,在Thread中调用Toast显示错误信息: new Thread(new Runnable(){ @Override public void run() { try{ weatherD ...

  7. docker镜像的操作

    在主机上列出镜像 sudo docker images 每从Docker Hub下载一个镜像就会启动相对的创建一个容器 在镜像列表中看到三个重要的东西: 来自什么镜像源,例如ubuntu 每个镜像都有 ...

  8. 浅析SQL Server 2005中的主动式通知机制

    一.引言 在开发多人同时访问的Web应用程序(其实不只这类程序)时,开发人员往往会在缓存策略的设计上狠下功夫.这是因为,如果将这种环境下不常变更的数据临时存放在应用程序服务器或是用户机器上的话,可以避 ...

  9. date类型时间比较大小

    #方法一Date1.after(Date2),当Date1大于Date2时,返回TRUE,当小于等于时,返回false:Date1.before(Date2),当Date1小于Date2时,返回TRU ...

  10. IOS UItableView 滚动到底 触发事件

    开发过程中,在使用UItableView 总会遇到加载更多的问题,到底是手势响应瀑布流的方法好? 还是添加一个底端cell点击触发加载更多好?我也想有自己的判断.但是我们老板总说了算,没办法,谁叫我给 ...