overflow 特性表明:
版本号：CSS2 适配性：IE4+ NS6+ 承继性：无
英语的语法：overflow : visible | auto | hidden | scroll
有关主要参数表明以下：
visible:：不裁切內容也不加上翻转条。倘若显式申明此默认设置值，目标将被裁切为包括目标的window或frame的尺寸。而且clip特性设定将无效。
auto：此为body目标和textrea的默认设置值。在必须时裁切內容并加上翻转条
hidden：无法显示超出目标规格的內容。
scroll：一直显示信息翻转条。
应用表明及关键点：
◎ 查找或设定当目标的內容超出其特定高宽比及宽度时怎样管理方法內容。
◎ 设定textarea目标为hidden值将掩藏其翻转条。
◎ 针对table来讲，倘若table-layout特性设定为fixed，则td目标适用带有默认设置值为hidden的overflow特性。假如设为hidden，scroll或auto，那末超过td规格的內容将被裁切。假如设为visible，将致使附加的文字外溢到◎ 右侧或左侧（视direction特性设定而定）的模块格。
◎ 自IE5刚开始，此特性在MAC服务平台上能用。 对应的脚本制作特点为overflow。
示例：
body { overflow: hidden; }
div { overflow: scroll; height: 100px; width: 100px; }
text-overflow版本号：IE6+特有特性 承继性：无
div 外溢掩藏 div文本外溢用点(省略号)替代
在div合理布局中內容外溢了器皿，超过了器皿所限制的宽度应当如何办呢？很是疑虑，因而收集梳理1番，发现可让內容超过器皿时超过一部分显示信息省略号，这类做法不但处理了难题，并且很美观大方，好了，很少说了，有兴趣爱好的盆友能够参照下
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh">
<head profile="http://www.w3.org/2000/08/w3c-synd/#">
<meta http-equiv="content-language" content="zh-cn" />
<meta http-equiv="content-type" content="text/html;charset=gb2312" />
<title>div中外溢文本用点替代的编码</title>
<style type="text/css">
/*<![CDATA[*/
li {
width:200px;
white-space:nowrap;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
overflow: hidden;
}
/*]]>*/
</style>
</head>
<body>
<ul>
<li><a href="#">web规范普遍难题大全web规范普遍难题大全</a></li>
<li><a href="#">web规范普遍难题大全web规范普遍难题大全</a></li>
<li><a href="#">web规范普遍难题大全web规范普遍难题大全</a></li>
<li><a href="#">web规范普遍难题大全web规范普遍难题大全</a></li>
<li><a href="#">web规范普遍难题大全web规范普遍难题大全</a></li>
</body>
</html>
TD还可以外溢掩藏显示信息
也许我这篇文章内容1取这样的姓名，就会有人要问了：你如何还在关心table啊，那早就落伍了…赶快Xhtml…div好…ul好…ol好…dl好…完了，不知道道也有甚么好了。
table真的落伍了么？你真的掌握table么？你真的会用table么？
打口水仗并不是大家要做的，留给那些時间很充足的人吧。
言归正传：
不记得是何时，有人在用table仿真模拟DataGrid的情况下说，为何td超过设定为固定不动宽度的文本不可以掩藏，而是会立即换行呢？
是的，客观事实的确这般，如：
<style type="text/css">
table {width:500px;table-layout:fixed;}
.col1 {width:100px;}
.col2 {width:200px;}
.col3 {width:200px;}
td {white-space:nowrap;overflow:hidden;}
</style>
<table border="1" cellspacing="0" summary="回过头看来看Table：TD也玩overflow:hidden">
<tr>
<td class="col1">神舟 雅致Q400N</td>
<td class="col2">雅致Q400N，选用Intel Core2 Duo(Merom) T5450(1.66G)解决器</td>
<td class="col3">迅驰4服务平台，突显的性价比，好看的外型</td>
</tr>
</table>
运作如上编码，你会发现模块格里超出固定不动宽度的文本不容易被掩藏掉，而是换行显示信息了，明显，这其实不是我的原意。
看起来，这好像是table的1个特点，它不可以很好的适用{width:*px;white-space:nowrap;overflow:hidden;}的组成，归根结底便是white-space:nowrap这个东东没起功效，因此看起来overflow:hidden就无效了。{注：假如是1连串的不经意义标识符则可起效，比如：<td class="col1">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</td>，这个情况下就不必须{white-space:nowrap}来强制性它在1行内显示信息，由于这1连串的a会被评定为是1个字而不产生换行，从而超过.col1宽度的a会被掩藏}
［处理计划方案1：］
后来有人提到应用百分比宽度便可以了，经检测，的确能够，略微将第1段的在其中几行款式改动1下，其它的不会改变：
.col1 {width:20%;}
.col2 {width:40%;}
.col3 {width:40%;}
将改动后的编码运作后，会发现，超过宽度的文本果真被掩藏了，要想的实际效果好像获得了。
客观事实上应用百分比宽度的确能够处理这个文本掩藏的难题，但这好像其实不是要想的最好的处理计划方案，由于有的情况下大家必须的是1个固定不动的宽度，而并不是百分比宽度。
而这1切的根本原因就在于怎样使得模块格内的文本不换行在1行内显示信息。
［处理计划方案2：］
要做到这个规定，除应用款式，大家或许还会想起1个好久无需了的标识<nobr>，这个元素的功效便是强制性內容在1行显示信息。以上编码做以下改动，其它则不会改变：
<table border="1" cellspacing="0" summary="回过头看来看Table：TD也玩overflow:hidden">
<tr>
<td class="col1"><nobr>神舟 雅致Q400N</nobr></td>
<td class="col2"><nobr>雅致Q400N，选用Intel Core2 Duo(Merom) T5450(1.66G)解决器</nobr></td>
<td class="col3"><nobr>迅驰4服务平台，突显的性价比，好看的外型</nobr></td>
</tr>
</table>
做了这个改动，会发现，实际效果的确做到，是否该激动呢？不，这好像还并不是最好的处理计划方案，由于终究应用了1个好久无需且不强烈推荐应用的元素标识，这是多少令人感觉有点不爽。
沿着这个思路，我换了1个角度来考虑到这个难题，发现难题得到解决。
既然在固定不动宽度的模块格内没法只简易的给th,td再加white-space:nowrap，那末大家在固定不动宽度的模块格内再加1个标识元素呢？
最好计划方案：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="Content-Language" content="gb2312" />
<title>回过头看来看Table：TD也玩overflow:hidden</title>
<style type="text/css">
table {width:500px;table-layout:fixed;}
.col1 {width:100px;}
.col2 {width:200px;}
.col3 {width:200px;}
th strong {display:block;width:100%;}
tr strong,tr td {white-space:nowrap;overflow:hidden;}
</style>
</head>
<body>
<table border="1" cellspacing="0" summary="检测">
<thead>
<tr>
<th class="col1"><strong>商品名字</strong></th>
<th class="col2"><strong>商品详细介绍</strong></th>
<th class="col3"><strong>商品备注</strong></th>
</tr>
</thead>
<tbody>
<tr>
<td>神舟 雅致Q400N</td>
<td>雅致Q400N，2007年7月发售，选用Intel Core2 Duo(Merom) T5450(1.66G)解决器</td>
<td>迅驰4服务平台，突显的性价比，好看的外型</td>
</tr>
</tbody>
</table>
</body>
</html>
运作上面的编码，会发现这样的做法是能够的，并且从编码的简约性、可读性和有效性几层面来讲，都较前几种计划方案为好。
{都还没做过给模块格掩藏超出固定不动宽度內容的同学，可先在设备上玩玩，随后再看来本文}
实际上table是1个趣味，可玩性很高东东。大家不可该带着有色双眼去看它，由于它有它存在的道理。
以后会再次写1些有关table的文章内容，也作自娱之用。
