纯css实现轮播图可以看这里：纯css实现轮播图（自动轮播和手动轮播）效果_☆*往事随風*☆的博客_css轮播图-CSDN博客
代码来源：
html+css+jquery实现轮播图自动切换、左右切换、点击切换_jquery图片轮播幻灯片效果实现左右滚动图片切换代码-CSDN博客
JS实现轮播图的三种简单方法。_js轮播图-CSDN博客
1、html+css+jquery
（1）页面结构
<
>
（2）CSS样式
（3）功能实现
1、 实现点击两次按钮进行图片切换
（1）左侧按钮设置：当index==0时也就是展示第一张图的时候，通过if语句设置index的值为图片长度-1，通过点击左侧按钮index会进行自减操作，通过index图片获取的值会不断减少直至为0再一次重复之前的操作。
（2）右侧按钮：点击右侧按钮index会进行自增操作，当index的值等于图片长度-1时(也就是第一张图片位置)将index设置为0、
（3）在点击按钮之前通过css()方法将opacity和background-color设置为0和灰色，当点击按钮时通过eq()方法获取到图片的索引将图片的css()方法设置为opacity1和白色
2、实现圆点切换，首先需要获取点击圆点的索引，通过$(this).index();可以获取。实现点击圆点切换图片和圆点表示与点击两侧按钮切换图片一样都是通过opacity隐藏和显示图片
3、自动循环图片实现：设置周期定时器f通过index自增控制图片的显示，在点击图标和圆点时需要清楚定时器，不要在后面加入f();那样会快速的循环一边
2、html+css+JavaScript
（1）页面结构
<
>
（2）css样式