当前位置: 代码迷 >> Web前端 >> td掩藏多余文本
  详细解决方案

td掩藏多余文本

热度:100   发布时间:2012-11-01 11:11:32.0
td隐藏多余文本
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style>
table{ table-layout:fixed;}
td{text-overflow:ellipsis;overflow: hidden;white-space:nowrap;word-break:keep-all; }
td:after{ content:"***";}/* firefox下有效*/
</style>
</head>

<body>
<table id="query"  class="ht_tab1" width="100%" cellspacing="0" cellpadding="0" border="1">



	<tr>
		<td width="5%"  title="xxx" >ererwaasdasd</td>
		<td width="95%" title="yyy" >用户IDasdasdasdasdasdasd</td>
	
	</tr>
</table>
<div style="width:200px;text-overflow:ellipsis;overflow: hidden;white-space:nowrap; background-color:#00CC99;">这里是一个测试这里是一个测试这里是一个测试这里是一个测试</div>

</body>
</html>
  相关解决方案