<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" /> <script type="text/javascript" src="js/base.js"></script> <link rel="stylesheet" type="text/css" href="assets/css/weui.min.css" /> <link rel="stylesheet" type="text/css" href="assets/css/swiper-3.4.2.min.css" /> <link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_773803_pg69h896ba.css" /> <script type="text/javascript" src="assets/font/iconfont.js"> </script> <link rel="stylesheet" href="index.css" /> <style type="text/css"> .swiper-container { height: 3.6rem; } .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { left: 44%; } .lis .iconfont{ color:#999999; font-size: 0.5rem; } .active{ color: } </style> </head> <body> <div> <header> <span class="left"> <i class="iconfont icon-dizhi"></i> <span class="area" >天津</span> </span> <i class="iconfont icon-sousuo fang"></i> <input type="text" class="in" placeholder="搜索活动名称" /> </header> </div> <!--<div class='pic'> <div class="swiper-container "> <div class="swiper-wrapper"> <div class="swiper-slide"> <img src="images/banner.png" alt="" /> </div> <div class="swiper-slide"> <img src="images/banner.png" alt="" /> </div> <div class="swiper-slide"> <img src="images/banner.png" alt="" /> </div> </div> <div class="swiper-pagination"> <img src="images/banner.png" alt="" /> </div> </div> </div>--> <div class="list"> <ul> <li> <span><img src="images/zhou.png" alt="" /></span> <span class="zhou">周边短线</span> </li> <li> <span><img src="images/zhou.png" alt="" /></span> <span class="zhou">周边短线</span> </li> <li> <span><img src="images/zhou.png" alt="" /></span> <span class="zhou">周边短线</span> </li> <li> <span><img src="images/zhou.png" alt="" /></span> <span class="zhou">周边短线</span> </li> <li> <span><img src="images/zhou.png" alt="" /></span> <span class="zhou">周边短线</span> </li> <li> <span><img src="images/zhou.png" alt="" /></span> <span class="zhou">周边短线</span> </li> <li> <span><img src="images/zhou.png" alt="" /></span> <span class="zhou">周边短线</span> </li> <li> <span><img src="images/zhou.png" alt="" /></span> <span class="zhou">周边短线</span> </li> </ul> </div> <div class="riliout"> <div class="rili"> <i class='iconfont icon-rili1'></i> <span>行程日历</span> </div> </div> <!--===============最新活动==========--> <div class="piclist"> <div class="active"> <span>——最新活动——</span> </div> <div class="new_pic"> <img src="images/banner.png" alt="" /> </div> <div class="newxia"> <div class="left"> <div class="qing"> 轻装穿越八11峰4日行 </div> <div class="nianout"> <div class="nian"> <i class='iconfont icon-calendar'></i> <span>2018.08.13</span> </div> <div class="ji"> <i class='iconfont icon-Group-'></i> <span class="showcang">收藏</span> </div> </div> </div> <div class="right"> <div class="jia"> <span>¥<span></span>1100</span><br> </div> <div class="show"> <span class="showspan"> <span>售29</span> </span> <span class="sheng"> 省3 </span> </div> </div> </div> </div> <!--===============最新活动==========--> <div class="piclist"> <div class="active"> <span>——热门活动——</span> </div> <div class="new_pic"> <img src="images/banner.png" alt="" /> </div> <div class="newxia"> <div class="left"> <div class="qing"> 轻装穿越八11峰4日行 </div> <div class="nianout"> <div class="nian"> <i class='iconfont icon-calendar'></i> <span>2018.08.13</span> </div> <div class="ji"> <i class='iconfont icon-Group-'></i> <span class="showcang">收藏</span> </div> </div> </div> <div class="right"> <!--<div class="jia"> <span>¥<span></span>1100</span><br> </div>--> <!--<div class="show"> <span class="showspan" > <span>售29</span> </span> <span class="sheng"> 省3 </span> </div>--> </div> </div> </div> <!--====底部=====--> <footer class="foot"> <ul> <li> <sapn class="lis"> <i class='iconfont icon-nav'></i> <span>首页</span> </sapn> </li> <li> <sapn class="lis"> <span class="yuan"> <i class='iconfont icon-rili1'></i> </span> <span>形成日历</span> </sapn> </li> <li> <sapn class="lis"> <i class='iconfont icon-Group-'></i> <span>我的</span> </sapn> </li> </ul> </footer> <script type="text/javascript" src="assets/js/jquery-2.1.0.js"></script> <script type="text/javascript" src="assets/js/swiper-3.4.2.min.js"></script> <script type="text/javascript" src="assets/js/weui.js"></script> <script type="text/javascript" src="index.js"></script> <script> var mySwiper = new Swiper('.swiper-container', { pagination: '.swiper-pagination', autoplay: 1500,//可选选项,自动滑动 loop : true }) </script> </body> </html>