1.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>摄影社区热门小镇</title>
<style>
#Ba{width:520px;height:250px;margin:0px auto;border: 1px solid gray;padding: 0px 10px}
h5{padding: 10px 10px;margin: 0px;color: grey}
ul {list-style-type: none;padding: 0px 5px}
li strong{color: #388DFF;font-size: 12px} span{color: gray;font-size: 10px}
img{border: 1px solid gray;border-radius:8px;padding:3px;margin-left:10px;}
img:nth-of-type(3){margin-left:35px}
</style>
</head>
<body>
<div id="Ba">
<h5>摄影社区热门小镇</h5>
<img src="images/pic_01.jpg"/>
<ul style="display: inline-block">
<li><strong>风景狙击手</strong></li>
<li><span>成员:80</span></li>
<li><span>作品:276</span></li>
</ul>
<img src="images/pic_02.jpg"/>
<ul style="display: inline-block">
<li><strong>叙事感</strong></li>
<li><span>成员:235</span></li>
<li><span>作品:116</span></li>
</ul>
<img src="images/pic_03.jpg " />
<ul style="display: inline-block;">
<li><strong>定焦视界</strong></li>
<li><span>成员:56</span></li>
<li><span>作品:456</span></li>
</ul>
<img src="images/pic_04.jpg"/>
<ul style="display: inline-block">
<li><strong>中画幅乐园</strong></li>
<li><span>成员:130</span></li>
<li><span>作品&#