我有一些 html 表,其中文本数据太大而无法容纳。因此,它垂直扩展单元格以适应这种情况。因此,现在存在溢出的行的高度是数据量较小的行的两倍。这是无法接受的。如何强制表格具有相同的行高1em
?
这是一些重现该问题的标记。表格应该只有一行的高度,并且隐藏溢出的文本。
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
table { width:250px; }
table tr { height:1em; overflow:hidden; }
</style>
</head>
<body>
<table border="1">
<tr>
<td>This is a test.</td>
<td>Do you see what I mean?</td>
<td>I hate this overflow.</td>
</tr>
</table>
</body>
</html>
需要指定两个属性,table-layout:fixed
on table
and white-space:nowrap;
在细胞上。您还需要移动overflow:hidden;
也对细胞
table { width:250px;table-layout:fixed; }
table tr { height:1em; }
td { overflow:hidden;white-space:nowrap; }
这是一个演示 http://jsbin.com/ixetu。在 Firefox 3.5.3 和 IE 7 中测试
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)