这是页面的HTML代码，包括其中的CSS样式调用：
<ul class="hoverbox">
<li>
<a href="#">
<img alt="description" src="img/photo01.jpg"/>
<img class="preview" alt="description" src="img/photo01.jpg"/>
</a>
</li>
</ul>
以下是关于图片相册的CSS代码：
//////CSS代码////
.hoverbox {
cursor:default
list-style-image:none
list-style-position:outside
list-style-type:none
}
.hoverbox a {
cursor:default
}
.hoverbox a .preview {
display:none
}
.hoverbox a:hover .preview {
display:block
left:-30px
position:absolute
top:-33px
z-index:1
}
.hoverbox img {
background:#FFFFFF none repeat scroll 0% 0%
border-color:#AAAAAA rgb(204, 204, 204) rgb(221, 221, 221) rgb(187, 187, 187)
border-style:solid
border-width:1px
color:inherit
height:75px
padding:2px
vertical-align:top
width:100px
}
.hoverbox li {
background:#EEEEEE none repeat scroll 0% 0%
border-color:#DDDDDD rgb(187, 187, 187) rgb(170, 170, 170) rgb(204, 204, 204)
border-style:solid
border-width:1px
color:inherit
display:inline
float:left
margin:3px
padding:5px
position:relative
}
.hoverbox .preview {
border-color:#000000
height:150px
width:200px
}
你去试试看哦，就是这样的。
这个直接设置图片的大小就行了<img src="1.jpg" width="120px" height="120px" />
这样设置的话，大的图片会被自动缩成120*120px大小的，小的图片却不会拉伸。
