轮播框架
轮播框架是为了呈现出图片的切换,使页面变得整洁,它就是个盒子,把零散的东西装起来。使地方更加干净、整洁。轮流播放图片,我们可以设置手动切换,它也可以自动按定时器的时间切换。本文是用来插件来实现的,也是作者第一次成功实现轮播效果的操作,还是用在项目里的。实现后发现,它简单,简洁,好看。所以说轮播效果不仅是实现页面的整洁性,也实现了可观性。它整体的操作只有三部分,代码也少,不像轮播原生代码及其多,缩短了代码,所以它就变得简单了。
第一部分:因为是用了插件实现的,所以先引用插件。
<!—layui.css插件--> //可见内容 以上就是整个文档的结构,与之间的文本描述网页。 与之间的文本是可见的页面内容。 还有许多元素标签都在它们之间,例如:
与
之间的文本被显示为标题。与
之间的文本被显示为段落。 第二步:轮播框架的HTML部分,也就是轮播的布局或搭建。 首先是定义一个盒子/类,是标识轮播容器的类,类的名字class是使用插件的,因为框架的样式都是在插件里搭建好的,所以插件才那么好用,是别人搭建好的,封装好的类。第一个盒子是搭建框架的,接下来的盒子就是放图片的,也就是标识哪张图片所在的哪个盒子里的,最后一个是装图片的,然后每张图片外面都放一个盒子,就相当于是盒子在转动,图片只是装在盒子里,图片用img标签装载,img标签,他的src路径找到图片。