方案一：直接使用HTML的滚动标签 marquee ，把图片放入滚滚标签内部，代码如下：
<marquee>
<img src='1.jpg'>
<img src='2.jpg'>
<img src='3.jpg'>
<img src='4.jpg'>
</marquee>
方案二：使用第三方插件，比如swiper.js，
插件
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<body>标签中，输入html代码：<div style="overflow: scroll">hello world!</div>。
3、浏览器运行index.html页面，此时成功在html中指定的div中添加了滚动条。
1、新建一个文件夹，用来存放网页文件和图片，快捷键ctrl+shift+n。
2、进入新建文件夹里面，右键新建文本文档。
3、进入新建的文本文档，复制下方代码，点击快捷键ctrl+s保存后退出。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>百度知道</title>
</head>
<body>
<!--
position:fixed是设置为固定在页面的某个位置，不会随滚动条滚动而移动。
top: 50px图片距离页面顶部50像素。
right:10px图片距离页面右边10像素。
display:block设置图片为块状元素，这样图片不会单独占据行-->
<img style="position:fixedtop: 50pxright:10pxdisplay:block" src="1.png" alt="">
<p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p>
<p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p>
<p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p>
<p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p>
<p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p>
<p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p>
<p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p><p>百度知道</p>
</body>
</html>
4、重命名新建文本文档为index.html，原先的.txt的后缀同时去掉后保存，提示确实要更改后按“是”即可。
5、添加背景图片源文件，并命名为1.png，这些图片为你需要放置的图片。
6、点击index.html，右键浏览器打开预览效果。
7、浏览器打开后即可得到如下效果
