DIV中，怎么实现图片的跑马灯效果？
- 提问者网友：精神病院里
- 2021-04-24 10:44
- 五星知识达人网友：何以畏孤独
- 2021-04-24 11:25
css样式文件名：StyleSheet.css
#pic
{
width:600px;
height:400px;
margin-left:auto;
margin-right:auto;
border:solid 1px #cccccc;
}
#pic ul
{
display:block;
list-style:none;
}
#pic li{ display:inline;}
代码：
<html xmlns=" http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<link href="StyleSheet.css" type="text/css" rel="stylesheet" />
</head>
<body>
<form id="form1" runat="server">
<div id="pic">
<marquee direction="left" behavior="scroll" onmouseover="this.stop()" onmouseout="this.start()" >
<ul>
<li><img alt="test" src=" http://pc.images22.51img1.com/6000/linlan19/cc43fb5d453e28bad66d98381f958a29.gif" style="height:400px;" /></li>
<li><img alt="test" src=" http://pe.images22.51img1.com/6000/linlan19/e5aab1c5619bc8f9fc278b8063ed0ef4.jpg" /></li>
<li><img alt="test" src=" http://p8.images22.51img1.com/6000/linlan19/8b54f908549e6f94595c11a13526a496.gif" /></li>
<li><img alt="test" src=" http://pc.images22.51img1.com/6000/linlan19/c550866933dbd059c0eb5c03498fd686.jpg" /></li>
<li><img alt="test" src=" http://pd.images22.51img1.com/6000/linlan19/dff924cd48769a94bf6543e6a9a4fcf9.jpg" /></li>
<li><img alt="test" src=" http://pb.images22.51img1.com/6000/linlan19/b4f7ce7c7629e254826eeca8dd5a441b.jpg" /></li>
</ul>
</marquee>
</div>
</form>
</body>
</html>