广州鸿名健康科技有限公司


CSS 图片廊

网络编程 CSS 图片廊 09-20

图片廊

T以下是使用CSS创建图片廊:

<html><head><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="klematis_big.htm">  <img src="klematis_small.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="klematis2_big.htm">  <img src="klematis2_small.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="klematis3_big.htm">  <img src="klematis3_small.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="klematis4_big.htm">  <img src="klematis4_small.jpg" alt="Klematis" width="110" height="90">  </a>  <div class="desc">Add a description of the image here</div></div></body></html>

在线运行


编辑:广州鸿名健康科技有限公司

标签:在线,图片,klematis4_big,inline,display