简单demo使用HTML+CSS 实现轮播图三张图为例，分别为红绿蓝的效果不能发视频，截图来代替吧 1显示 轮播图1实际轮播的第2个元素li2显示 轮播图2实际轮播的第3个元素li3显示 轮播图3实际轮播的第4个元素li4显示 轮播图1实际轮播的第5个元素li，之后会紧跟着。

首先，得有个DIV，然后把轮播代码丢到DIV里，然后写个id为a的A标签，标签根据DIV定位到右上角，如果这时候你看到a标签不在广告上面，那你就给a标签设置zindex属性，还不行就给DIV也设上我不大熟悉这玩意，不过大概是这样的。

第一款经典的带有小圆点的轮播图，HTML5与CSS3的完美结合第二款专为人物展示或电影信息设计，同样使用HTML5和CSS3打造的优雅轮播第三款蓝色背景轮播图，简洁大气，展示你的设计功力第四款按钮控制的轮播设计，交互体验更佳第五款图片轮播，基本且实用，适用于各种场景第六款垂直。

用html和css实现轮播图的两种方法 animationname指定需要绑定到选择器的关键帧的名称Animationduration指定完成动画所需的时间，以秒或毫秒为单位动画计时功能指定动画的速度曲线Animationdelay指定动画开始前的延迟Animationiterationcount指定动画播放的次数Animationdirection指定动画是。

具体来说，网页的图片轮播实现过程如下1 设计轮播结构使用HTML创建包含图片的轮播结构，可以是一个包含多张图片的容器或者多个带有图片的链接列表2 添加样式通过CSS为轮播图片添加样式，包括大小调整边框设计以及过渡效果的设置等同时，可以利用CSS动画属性设置切换动画的时间和效果3 实现。

动画的偏移值和图片大小相关使用css3实现轮播特效的原理首先必须保证展示容器大小与图片大小相同，再为图片添加float效果，然后确定插入的图片数量并且为每个图片设置动画阶段，其中每个阶段都是通过使用keyframes设置递增的marginleft值达到切换的效果使用css3实现图片轮播特效的步骤代码步骤一使用HTML。

2这个轮播图，我们通过两大模块构成左右点击模块和姓名点击模块然后在两者相关联来达到最终的效果在使用js实现轮播图的效果前，先使用HTML和CSS完善这一模块的布局本轮播图使用8张图片每次出现两张3轮播图的做法如下首先就是要构架好整个轮播的盒子，以及它所需要的内容是为了轮播切换。

要看代码中，对应的标签，再去css中删除，我可以手把手教你。