<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>摄影社区热门小镇</title>
<style type="text/css">
#nav {
border: 1px solid #BDBDBD;
width: 725px;
}
h3 {
margin-bottom: 8px;
font-size: 16px;
margin-left: 10px;
margin-top: 10px;
font-weight: 600;
}
.div-box {
display: inline-block;
margin-right: 70px;
}
.div-box2{
display: inline-block;
margin-right: 20px;
}
.div-box3{
display: inline-block;
}
.login {
margin-left: 10px;
border: 1px solid #BDBDBD;
padding: 5px;
width: 60px;
height: 60px;
border-radius: 5px;
display: inline-block;
}
ul {
line-height: 20px;
padding-top: -5px;
margin-left: -30px;
list-style-type: none;
display: inline-block;
}
a {
color: #2E75BC;
text-decoration: none;
}
.li {
margin-top: 8px;
}
li {
margin-bottom: 2px;
font-size: 13px;
color: #BDBDBD;
}
</style>
</head>
<body>
<div id="nav">
<h3>摄影社区热门小镇</h3>
<div class="div-box">
<div class="login">
<img src="img/pic_01.jpg" />
</div>
<ul>
<span><a href="#">风景狙击手</a></span>
<li class="li">成员：80</li>
<li>作品：276</li>
</ul>
</div>
<div class="div-box">
<div class="login">
<img src="img/pic_02.jpg" />
</div>
<ul>
<span><a href="#">叙事感</a></span>
<li class="li">成员：235</li>
<li>作品：116</li>
</ul>
</div>
<div class="div-box">
<div class="login">
<img src="img/pic_03.jpg" />
</div>
<ul>
<span><a href="#">定焦视界</a></span>
<li class="li">成员：50</li>
<li>作品：456</li>
</ul>
</div>
<div class="div-box">
<div class="login">
<img src="img/pic_04.jpg" />
</div>
<ul>
<span><a href="#">中画幅乐园</a></span>
<li class="li">成员：130</li>
<li>作品：239</li>
</ul>
</div>
<div class="div-box2">
<div class="login">
<img src="img/pic_05.jpg" />
</div>
<ul>
<span><a href="#">《卡啪》先锋...</a></span>
<li class="li">成员：78</li>
<li>作品：125</li>
</ul>
</div>
<div class="div-box3">
<div class="login">
<img src="img/pic_06.jpg" />
</div>
<ul>
<span><a href="#">植物的无声世界</a></span>
<li class="li">成员：235</li>
<li>作品：1258</li>
</ul>
</div>
</div>
</body>
</html>
第十四篇
最新推荐文章于 2023-02-08 16:05:19 发布
扫一扫
9243
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
