【CSS】图片廊

图片廊"/>

【CSS】图片廊

以下是使用CSS创建图片廊：

图片廊

以下是使用 CSS 创建图片廊：

<style>div.img {margin: 5px;border: 1px solid #ccc;float: left;width: 180px;}div.img:hover {border: 1px solid #777;}div.img img {width: 100%;height: auto;}div.desc {padding: 15px;text-align: center;}
</style>
<div class="responsive"><div class="img"><a target="_blank" href=".jpg"><img src=".jpg" alt="图片文本描述" width="300" height="200"></a><div class="desc">这里添加图片文本描述</div></div>
</div><div class="responsive"><div class="img"><a target="_blank" href=".jpg"><img src=".jpg" alt="图片文本描述" width="300" height="200"></a><div class="desc">这里添加图片文本描述</div></div>
</div><div class="responsive"><div class="img"><a target="_blank" href=".jpg"><img src=".jpg" alt="图片文本描述" width="300" height="200"></a><div class="desc">这里添加图片文本描述</div></div>
</div><div class="responsive"><div class="img"><a target="_blank" href=".jpg"><img src=".jpg" alt="图片文本描述" width="300" height="200"></a><div class="desc">这里添加图片文本描述</div></div></div>