首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

怎么做几排小格子的图片框

2012-03-19 
如何做几排小格子的图片框各位好!我做一个网页,需要放很多照片,如何能作出几排小格子的图片框,然后点击这

如何做几排小格子的图片框
各位好!
我做一个网页,需要放很多照片,如何能作出几排小格子的图片框,然后点击这个小图片再弹出大的照片。这几排图片框是否就用table来做?

[解决办法]
首先应该把大图片截成缩略图,这样可以节省带宽~~~

如果不截成缩略图,简单点可以这样做;

<html>
<style>
table img{
height:80px;
width:80px;
cursor:hand;
}
</style>
<script>
function showBig(img){
window.open(img.src);
}
</script>
<body>
<table>
<tr>
<td> <img src= "01.jpg " onclick= "showBig(this) " title= "点击放大 " /> </td>
<td> <img src= "01.jpg " onclick= "showBig(this) " title= "点击放大 " /> </td>
<td> <img src= "01.jpg " onclick= "showBig(this) " title= "点击放大 " /> </td>
</tr>
<tr>
<td> <img src= "01.jpg " onclick= "showBig(this) " title= "点击放大 " /> </td>
<td> <img src= "01.jpg " onclick= "showBig(this) " title= "点击放大 " /> </td>
<td> <img src= "01.jpg " onclick= "showBig(this) " title= "点击放大 " /> </td>
</tr>
</table>
</body>
</html>

热点排行