如何使并排的多个表格在窗口缩小时被挤压分行？

jzsh2000 2006-01-06 02:34:31

如果是并排的多个图片，当窗口宽度小于图片宽度之和的时候，后面的图片就会被挤压分行，请问这种效果如何在并排的表格中实现？代码如下：
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
<html><body>
<table border="1" width="100%">
<tr>
<td>
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
</td>
</tr>
</table>
<table border="1" width="100%">
<tr>
<td>
<table border="1" width="300" align="left"><tr><td>11</td></tr></table>
<table border="1" width="300" align="left"><tr><td>22</td></tr></table>
<table border="1" width="300" align="left"><tr><td>33</td></tr></table>
<table border="1" width="300" align="left"><tr><td>44</td></tr></table>
<table border="1" width="300" align="left"><tr><td>55</td></tr></table>
<table border="1" width="300" align="left"><tr><td>66</td></tr></table>
</td>
</tr>
</table>
</body></html>

...全文

232 7 打赏收藏转发到动态举报

写回复

用AI写文章

7 条回复

切换为时间正序

请发表友善的回复…

发表回复

jouwei 2006-01-10

打赏
举报

楼上的方法不错。但不知可有通用一点方法？
比如将下面表格的各列也自动分行？
<table border="1" width="300" align="left">
<tr><td>11</td><td>22</td><td>33</td><td>44</td></tr>
</table>

jzsh2000 2006-01-10

打赏
举报

非常感谢：）

ice_berg16 2006-01-09

打赏
举报

设置要自动换行的表格的float:left;
------------------------------------------------
<html>
<style>
#tbl table{
float:left;
}
</style>
<body>
<table border="1" width="100%">
<tr>
<td>
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
<img src="http://community.csdn.net/logo/Images/eye001.gif" width="300">
</td>
</tr>
</table>
<table border="1" width="100%">
<tr>
<td id="tbl">
<table border="1" width="300" align="left"><tr><td>11</td></tr></table>
<table border="1" width="300" align="left"><tr><td>22</td></tr></table>
<table border="1" width="300" align="left"><tr><td>33</td></tr></table>
<table border="1" width="300" align="left"><tr><td>44</td></tr></table>
<table border="1" width="300" align="left"><tr><td>55</td></tr></table>
<table border="1" width="300" align="left"><tr><td>66</td></tr></table>
</td>
</tr>
</table>
</body></html>

fengzi0924 2006-01-09