一行内文本溢出的处理

日期：2013-12-16  来源：攀枝花惠康网络公司

看到这个问题很轻易就会想到截断文字加“…”的做法。哈哈，就是这样。其实写这篇日志也只是把这样体例做个记实，因为仿佛写了这么多次，仍是会不太记得。嘿嘿~~

==============CSS================
.text-overflow{
display:block;/*内联对象需加*/
width:31em;
word-break:keep-all;/* 不换行 */
td{
white-space:nowrap;/* 不换行 */
text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标识表记标帜(…) ；需与overflow:hidden;一路使用。*/
=================================

}
=================================

对于表格的话，界说有一点纷歧样：
==============CSS================
table{
overflow:hidden;/* 内容超出宽度时潜匿超出部门的内容 */
width:30em;
table-layout:fixed;/* 只有界说了表格的结构算法为fixed，下面td的界说才能起浸染。 */
}
width:100%;
word-break:keep-all;/* 不换行 */

一般的文字截断(合用于内联与块)：
overflow:hidden;/* 内容超出宽度时潜匿超出部门的内容 */
text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标识表记标帜(…) ；需与overflow:hidden;一路使用。*/
white-space:nowrap;/* 不换行 */
}

注：这个东东只对单行的文字的效，如不美观你想把它用在多行上，也只有第一行有浸染的。 这个写法只有IE会有“…”，其它的浏览器文本超出指定宽度时会潜匿。