<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>omg</title>
<link rel="stylesheet" type="text/css" href="../static/css/202.css">
</head>
<body>
<div >
<div class="img" >
<a href="">
<img src="http://file26.mafengwo.net/M00/7E/E5/wKgB4lIuf3SAYD0bABI2F295q_Q73.jpeg"></a>
<div class="desc"><a href="">丹东风景</a></div>
</div>
<div class="img">
<a href="">
<img src="http://file25.mafengwo.net/M00/FB/10/wKgB4lNwQ1eAXFr1AALE2JpaC-E02.jpeg">
<div class="desc"><a href="">毛里求斯风景</a></div>
</div>
<div class="img">
<a href="">
<img src="http://img1.qunarzz.com/travel/d2/201212/01/49eae9eeea2afb89ddb12cfb.jpg_r_480x360x95_ed9e0971.jpg"></a>
<div class="desc"><a href="">九龙潭风景</a></div>
</div>
<div class="img" >
<a href="">
<img src="http://file20.mafengwo.net/M00/87/12/wKgB3FGMgSCAZo0qAAgGckFTqJA54.jpeg"></a>
<div class="desc"><a href="">香港风景</a></div>
</div>
</div>
<div class="clearfloat">
<img src="http://file26.mafengwo.net/M00/7E/E5/wKgB4lIuf3SAYD0bABI2F295q_Q73.jpeg">
<img src="http://file25.mafengwo.net/M00/FB/10/wKgB4lNwQ1eAXFr1AALE2JpaC-E02.jpeg">
<img src="http://img1.qunarzz.com/travel/d2/201212/01/49eae9eeea2afb89ddb12cfb.jpg_r_480x360x95_ed9e0971.jpg">
<img src="http://file20.mafengwo.net/M00/87/12/wKgB3FGMgSCAZo0qAAgGckFTqJA54.jpeg">
</div>
</body>
</html>
img{
width:300px;
}
div.img{
border:1px solid #cccccc;
width:180px;
height:150px;
float:left;
margia:5px;
}
div.img img{
width:100%;
height:80%;
}
div.desc{
text-align:center;
padding:5px;
}
div.img:hover{
border:1px solid #777777;
}
.cleater float{
clear:both;
}