<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>img</title>
<link rel="stylesheet" type="text/css" href="static/css/20.css">
</head>
<body>
<div class="recommend">
<div class="img">
<a href="http://www.gzcc.cn"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1508470501835&di=ee39b28ecbf99c25f74d58d9ffe82324&imgtype=0&src=http%3A%2F%2Fimg15.3lian.com%2F2015%2Fa1%2F17%2Fd%2F103.jpg"></a>
<div class="desc"><a href="http://www.gzcc.cn">校园风光</a></div>
</div>
<div class="img">
<a href="http://www.gzcc.cn"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1508470501837&di=b38f6bdf60876058de40ffeccf9594a2&imgtype=0&src=http%3A%2F%2Fimage82.360doc.com%2FDownloadImg%2F2015%2F02%2F1702%2F50258430_3.jpg" ></a>
<div class="desc"><a href="http://www.gzcc.cn">校友风采</a></div>
</div>
<div class="img">
<a href="http://www.gzcc.cn"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1508470501834&di=08e20a1a9a471027dd2aebfaa10e174a&imgtype=0&src=http%3A%2F%2Fimg0.ph.126.net%2Fq56WqeGz-DIkd2j_KfgERA%3D%3D%2F6599319367447546437.jpg" ></a>
<div class="desc"><a href="http://www.gzcc.cn">学校文化</a></div>
</div>
</div>
<div class="clearfloat">
<a href="http://www.gzcc.cn"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1508470501837&di=b38f6bdf60876058de40ffeccf9594a2&imgtype=0&src=http%3A%2F%2Fimage82.360doc.com%2FDownloadImg%2F2015%2F02%2F1702%2F50258430_3.jpg" alt="4"></a><br>
<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1508470501837&di=cbcfba0d0f86734c5f58d3a308652e41&imgtype=0&src=http%3A%2F%2Fimage13-c.poco.cn%2Fmypoco%2Fmyphoto%2F20120603%2F10%2F44921306201206031053543978391258438_003.jpg" ><br>
<img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1508470501836&di=a88a803aa561194b736956cd90a58b87&imgtype=0&src=http%3A%2F%2Fimg17.3lian.com%2Fd%2Ffile%2F201701%2F05%2F053489996fcb1584914fff107651c81f.jpg" ><br>
</div>
</body>
</html>>
img{
300px;
}
div.img{
border: 1px solid #ccc;
180px;
height: 180px;
float: left;
margin: 5px;
}
div.img img{
100%;
height: auto;
}
div.desc{
text-align: center;
padding: 5px;
}
div.img:hover{
border: 1px solid red;
}
div.clearfloat{
clear: both;
}
