HTML图像画廊 - 爱码网

美名其曰：图像画廊
其实就是滚动展示的图片

有很多种方法。我用的是最为常见的 <marquee >

效果图如下：

HTML图像画廊


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>图像画廊</title>
<style type="text/css">
	img{width:100px;height:100px;border:2px #cc0066 ridge;}
	ul{list-style-type:none;}
	li{float:left;}
  </style>
 </head>
 <body>
 <h2 align="center">图像画廊</h2>
  <hr color="#00ff33" size="5">
  <marquee behavior="alternate">
  <ul>
	<li><img src="t1.jpg" width="390" height="259" border="0" alt=""></li>
    <li><img src="t2.jpg" width="400" height="300" border="0" alt=""></li>
	<li><img src="t3.jpg" width="390" height="293" border="0" alt=""></li>
	<li><img src="t4.jpg" width="400" height="253" border="0" alt=""></li>
	<li><img src="t5.jpg" width="400" height="164" border="0" alt=""></li>
  </ul>
  </marquee>
   <hr color="#00ff33" size="5">

</body>
</html>