欢迎进入广州凡科互联网科技有限公司网站
全国服务热线
4000-399-000
微信小程序页面模板_Bootstrap轮播图学习使用
时间: 2021-01-12 14:21 浏览次数:
Bootstrap滚屏图学习培训应用 本文关键为大伙儿详尽详细介绍了Bootstrap滚屏图学习培训应用的有关材料,具备一定的参照使用价值,很感兴趣的小伙子伴们能够参照一下meta http-equ
Bootstrap轮播图学习使用       这篇文章主要为大家详细介绍了Bootstrap轮播图学习使用的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
meta http-equiv="X-UA-Compatible" content="IE=edge" meta name="viewport" content="width=device-width, initial-scale=1" title /title link rel="stylesheet" href="css/bootstrap.css" rel="external nofollow" / style #pic{ width:900px; margin:0 auto; .carousel-caption{ color:#f00; /style /head body !--carousel中文译为轮播,旋转木马 slide给图片添加运动效果; data-interval是间隔时间,不能低于400否则易出问题,单位为ms即毫秒; data-ride="carousel为页面一加载就开始轮播图片 carousel-caption是在图片上放置文字-- div div id="pic" data-interval="2000" data-ride="carousel" !--小圆点-- li /li li /li li /li li /li /ol !--轮播的图片-- div div img src="images/1.jpg"/ div h4 标题1 /h4 p xxxxxxxxxxxxxxxxxxxx /p /div /div div img src="images/2.jpg"/ div h4 标题2 /h4 p xxxxxxxxxxxxxxxxxxxx /p /div /div div img src="images/3.jpg"/ div h4 标题3 /h4 p xxxxxxxxxxxxxxxxxxxx /p /div /div div img src="images/4.jpg"/ div h4 标题4 /h4 p xxxxxxxxxxxxxxxxxxxx /p /div /div /div !--左右按钮-- a href="#pic" rel="external nofollow" rel="external nofollow" data-slide="prev" lsaquo; /a a href="#pic" rel="external nofollow" rel="external nofollow" data-slide="next" rsaquo; /a /div /div script src="js/jquery-2.1.0.js" /script script src="js/bootstrap.js" /script /body /html

Bootstrap轮播图的效果:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持凡科。




Copyright © 广州凡科互联网科技有限公司 版权所有 粤ICP备10235580号
全国服务电话:4000-399-000   传真:021-45545458
公司地址:广州市海珠区工业大道北67号凤凰创意园