上一篇
下一篇
我的CSS心得(5) - 让文字自动适应Table宽度
作者:puterjam 日期:2006-04-15
以下的例子是用样式实现，文字自动适应Table的宽度，并且超出的宽度的文字自动隐藏。IE下面还可以自动出现...的省略符号.
所用到的样式:
关键样式:
table-layout:fixed 固定布局的算法,则表格被呈递的默认宽度为 100% (For IE,Mozilla)
text-overflow:ellipsis 当对象内文本溢出时显示省略标记(...) (For IE)
overflow:hidden 不显示超过对象尺寸的内容 (For IE,Mozilla)
white-space: nowrap 强制在同一行内显示所有文本，直到文本结束或者遭遇 br 对象 (For IE,Mozilla)
演示:
HTML代码
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
所用到的样式:
复制内容到剪贴板
程序代码
程序代码 .ctl{
table-layout:fixed
}
.ctl td{text-overflow:ellipsis;overflow:hidden;white-space: nowrap;padding:2px}
table-layout:fixed
}
.ctl td{text-overflow:ellipsis;overflow:hidden;white-space: nowrap;padding:2px}
关键样式:
table-layout:fixed 固定布局的算法,则表格被呈递的默认宽度为 100% (For IE,Mozilla)
text-overflow:ellipsis 当对象内文本溢出时显示省略标记(...) (For IE)
overflow:hidden 不显示超过对象尺寸的内容 (For IE,Mozilla)
white-space: nowrap 强制在同一行内显示所有文本，直到文本结束或者遭遇 br 对象 (For IE,Mozilla)
演示:
HTML代码[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
文章来自: 
引用通告: 
Tags: 
相关日志:
评论: 6 | 引用: 7 | 查看次数: 15426
回复
jackery[2007-02-10 08:06 AM | 
]恩，不错！正需要呢！
GOOG
五个字!"太帅了"~~~~~~~~~~~~~~
支持一个 谢谢
实用 可为站子提高小许效率 
把代码放到哪个文件里面?
能使用在"最新日志"侧边栏里面吗?让日志标题只占一行,多余的就用...代替
能使用在"最新日志"侧边栏里面吗?让日志标题只占一行,多余的就用...代替
发表评论
