web前端－CSS 图片廊－026

最新推荐文章于 2024-06-11 06:02:41 发布

洲洋世界

最新推荐文章于 2024-06-11 06:02:41 发布

阅读量457

点赞数 1

分类专栏： web前端文章标签： css web前端

本文链接：https://blog.csdn.net/helloMr_wo/article/details/52787236

版权

web前端专栏收录该内容

83 篇文章 2 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>www.baidu.com</title>  
<style>
div.img
{
  margin: 2px;
  border: 1px solid #0000ff;
  height: auto;
  width: auto;
  float: left;
  text-align: center;
}   
div.img img
{
  display: inline;
  margin: 3px;
  border: 1px solid #ffffff;
}
div.img a:hover img {border: 1px solid #0000ff;}
div.desc
{
  text-align: center;
  font-weight: normal;
  width: 120px;
  margin: 2px;
}
</style>
</head>
<body>

<div class="img">
 <a target="_blank" href="****.htm"><img src="/****.jpg" alt="Klematis" width="110" height="90"></a>
 <div class="desc">Add a description of the image here</div>
</div>
<div class="img">
 <a target="_blank" href="******.htm"><img src="/*******.jpg" alt="Klematis" width="110" height="90"></a>
 <div class="desc">Add a description of the image here</div>
</div>
<div class="img">
 <a target="_blank" href="*****.htm"><img src="/*****.jpg" alt="Klematis" width="110" height="90"></a>
 <div class="desc">Add a description of the image here</div>
</div>
<div class="img">
 <a target="_blank" href="*****.htm"><img src="/*****.jpg" alt="Klematis" width="110" height="90"></a>
 <div class="desc">Add a description of the image here</div>
</div>

</body>
</html>

洲洋世界

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
web前端－CSS 图片廊－026

<!DOCTYPE html><html><head><meta charset="utf-8"> <title>www.baidu.com</title> <style>div.img{ margin: 2px; border: 1px solid #0000ff; height: auto; width: auto; float: left; text-a
复制链接

扫一扫