帮帮忙吧!如何使html表格的单元格高度不变?

carriezyp 2003-10-24 09:33:21
我使用了tablelayout=fixed的table,通过给第一行的每个td设置width值,和给每个tr设置height值,成功的实现了表格中每个td的宽度和高度固定不变,这样如果td的内容超宽则折行,如果超高也不会将td撑高,而是超出部分被剪切掉了,我要的正是这种效果。但是忽然发现,如果td的rowspan>1,那么如果内容超高显示不下就会将td撑到足以显示全部内容的高度。
请高手帮帮忙,怎样才能使td的高度不被撑大呀!
(注:当td的colspan>1时,效果正常,不会被内容撑宽。)
...全文
829 点赞 收藏 14
写回复
14 条回复
切换为时间正序
当前发帖距今超过3年,不再开放新的回复
发表回复
carriezyp 2003-11-21
up
回复
chocolateboy 2003-11-21
补充,上面的例子里我用的是<td valign=center><div style='height:100%;width:100%;overflow:hidden'>qqqqqqqqqqqqqqq<div></td>,这时因为div始终与td等高,所以不会影响td高,但td的valign=center时div总是从td中间位置开始,如果不用百分比而是用与td相同的尺寸数值如<td valign=center height=50 width=50><div style='height:50px;width:50px;overflow:hidden'>qqqqqqqqqqqqqqq<div></td>则div总是从td最上面开始。总之加了div就会影响对齐效果。
----------------------------------------------
上面的论述不清楚,另外你把align="center"写成了valign=center

总之你要实现的是否是:单元格长宽保持不变且单元格内容水平和垂直方向对齐?

<td width="25%" align="center" vlign="middle"><div style="overflow:hidden;height:20;width:这里使用固定宽度;border:1px solid #000000;">content</div></td>
回复
hrh1979 2003-11-06
关注
回复
chmask 2003-11-06
帮顶一下吧……
回复
rockypan 2003-11-06
干脆把要填的内容缩小或剪掉好了。
回复
angxain 2003-11-05
up
回复
carriezyp 2003-11-04
up
回复
carriezyp 2003-10-29
‘再嵌入一个表格’同样会影响对齐效果,处理起来非常麻烦
回复
echolwl 2003-10-27
关注这个问题,因为我也遇见这种问题,怎么解决那??
回复
李睿_Lee 2003-10-27
那就换个思路:
在colspan>1的<td>里再嵌入一个表格
试试
回复
carriezyp 2003-10-24
补充,上面的例子里我用的是<td valign=center><div style='height:100%;width:100%;overflow:hidden'>qqqqqqqqqqqqqqq<div></td>,这时因为div始终与td等高,所以不会影响td高,但td的valign=center时div总是从td中间位置开始,如果不用百分比而是用与td相同的尺寸数值如<td valign=center height=50 width=50><div style='height:50px;width:50px;overflow:hidden'>qqqqqqqqqqqqqqq<div></td>则div总是从td最上面开始。总之加了div就会影响对齐效果。
回复
carriezyp 2003-10-24
谢谢,可是这种方法我也试过,虽然可以解决固定高的问题,但又会引起另一个问题,就是对于td中的内容来说,放在div里和不放在div里,在td的垂直对齐方式为middle或bottom时显示效果是不同的。比如,<td valign=center>qqqqqqqqqqqqqqq</td>,字符串内容从td的中间位置向上下对称延伸,而<td valign=center><div style=...>qqqqqqqqqqqqqqq<div></td>,由于div被定位在td的中间位置,因此字符串的内容就从td的中间位置向下延伸。而我需要的是既固定高度又保持对齐效果,所以不能使用div。麻烦各位,还有别的办法吗?
回复
zhfkiller 2003-10-24
<html>

<head>
<title>New Page 1</title>
</head>

<body>

<table border="1" width="100%">
<tr>
<td width="25%"><span style="overflow:hidden;height:20">fdsasdfasdfa<p>fasffdasfsdaf</p></span></td>
<td width="25%"><span style="overflow:hidden;height:20;width:200">fdsasdfasdfasdfggggggggggggggggfasffdasfsdaf</p></span></td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="25%"> fdsasdfasdfa<p>fasffdasfsdaf</p></td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
</table>

</body>

</html>
把单元格内容放到<span>或<div>里面,将其overflow设为hidden,然后设定高和宽
回复
zhfkiller 2003-10-24
<html>

<head>
<title>New Page 1</title>
</head>

<body>

<table border="1" width="100%">
<tr>
<td width="25%" ><span style="overflow:hidden;height:20"><font size="6">fasdfasf</font></span></td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
<tr>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
<td width="25%"> </td>
</tr>
</table>

</body>

</html>
回复
相关推荐
发帖
CSS
创建于2007-09-28

6.0w+

社区成员

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
申请成为版主
帖子事件
创建了帖子
2003-10-24 09:33
社区公告
暂无公告