如何叠加图像

我只是在一个项目中做完了这件事。HTML端看起来像这样：

<a href="[fullsize]"  title="">  <img src="[thumbnail pic]" height="90" width="140" alt="[Gallery Photo]"  />  <span >      <img src="/images/misc/zoom.gif" width="32" height="32" alt="Zoom">  </span></a>

然后使用CSS：

a.gallerypic{  width:140px;  text-decoration:none;  position:relative;  display:block;  border:1px solid #666;  padding:3px;  margin-right:5px;  float:left;}a.gallerypic span.zoom-icon{  visibility:hidden;  position:absolute;  left:40%;  top:35%;  filter:alpha(opacity=50);  -moz-opacity:0.5;  -khtml-opacity: 0.5;  opacity: 0.5;}a.gallerypic:hover span.zoom-icon{  visibility:visible;}

我在CSS上留下了很多示例，因此您可以看到我是如何决定使用该样式的。注意我降低了不透明度，以便您可以通过放大镜看到。

希望这可以帮助。

编辑：为了澄清您的示例- 如果您愿意，您可以忽略

visibility:hidden;

:hover