<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>作业2</title>
<style>
*{ margin:0; padding:0; }
.bigBox{ width:720px; margin:100px auto; }
.bigBox .box{ width:230px; height:230px; overflow:hidden; float:left; position:relative;margin:0 5px; }
.bigBox .box img{ border:5px solid gray; }
.bigBox .box .boxTop{ width:228px; height:228px; position:absolute; top:0; left:0; border:1px solid green; background:rgba(255,255,255,0.5); display:none; }
.bigBox .box .boxTop span{ display:inline-block; background:url(../images/logo.gif) no-repeat 10px 0; color:#000; font-size:14px; padding-left:35px; margin-top:10px; }
.bigBox .box i{ display:block; position:absolute; background:url(../images/tu.gif) no-repeat; width:25px; height:25px; bottom:10px; left:10px; }
.bigBox .box a:hover .boxTop{ display:block; }
.bigBox .box a:hover i{ background-image:url(../images/tu2.gif); }
</style>
</head>
<body>
<div class="bigBox">
<div class="box">
<a href="">
<img src="../images/img01.jpg" alt="">
<div class="boxTop">
<span>今天天气好晴朗，处处好风光</span>
</div>
<i></i>
</a>
</div>
<div class="box">
<a href="">
<img src="../images/img01.jpg" alt="">
<div class="boxTop">
<span>今天天气好晴朗，处处好风光</span>
</div>
<i></i>
</a>
</div>
<div class="box">
<a href="">
<img src="../images/img01.jpg" alt="">
<div class="boxTop">
<span>今天天气好晴朗，处处好风光</span>
</div>
<i></i>
</a>
</div>
</div>
</body>
</html>
lunbo.zip （31个子文件） 
images 
c7.jpg 2KB mn1.jpg 9KB c8.jpg 2KB mn4.jpg 9KB img06.jpg 47KB
dianzixiangce.png 70KB mn6.jpg 11KB img03.jpg 11KB mn3.jpg 10KB mn7.jpg 24KB mn2.jpg 7KB img04.jpg 36KB
logo.gif 892B mn8.jpg 18KB c6.jpg 1KB tu.gif 950B tu1.gif 156B tu2.gif 950B mn5.jpg 8KB c5.jpg 982B img07.jpg 31KB img05.jpg 42KB c1.jpg 1023B img01.jpg 10KB c3.jpg 1KB c4.jpg 1KB c2.jpg 963B img02.jpg 15KB js html 
photo1.html 1KB photo3.html 2KB photo2.html 2KB css 资源评论
