Ric*_*ett 37 html css user-interface html-table
我有一个包含各种长度文本的单元格的表格.所有表格单元的宽度必须相同.如果这意味着截断长词或强制中断长词,那就没关系.
我无法弄清楚如何让这个工作.
这适用于内部客户端应用程序,因此只需要在IE6和IE7中工作.
下面是一个示例页面.包含的细胞onereallylongword是令人讨厌的细胞.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
td { width: 30px; }
</style>
</head>
<body>
<table border="2">
<tr>
<td>word</td>
<td>two words</td>
<td>onereallylongword</td>
</tr>
</table>
</body>
</html>
inf*_*ris 35
只要你修改表本身的宽度并设置table-layout属性,这很简单:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
td { width: 30px; overflow: hidden; }
table { width : 90px; table-layout: fixed; }
</style>
</head>
<body>
<table border="2">
<tr>
<td>word</td>
<td>two words</td>
<td>onereallylongword</td>
</tr>
</table>
</body>
</html>
我在IE6和7中测试了它,它似乎工作正常.
小智 21
如果你想在新行中正确包装长文本,那么在你的表id中调用使用css属性,table-layout:fixed;否则简单地说css不能破坏新行中的长文本.
Dio*_*ane 17
Stack Overflow通过使用DIV解决了长行代码的类似问题overflow-x:auto.CSS无法为你分解单词.
小智 10
试试这个:
text-overflow: ellipsis;
overflow: hidden;
white-space:nowrap;