蔬菜商城网站wap静态页面模板下载

模板描述：wap蔬菜商城网站 清新风格 模板下载，wap蔬菜商城网站清新风格的模板下载html模板下载

代码部署教程

1. 引入CSS

<link href=”css/bootstrap.min.css” rel=”stylesheet”>
<link href=”css/style.css” rel=”stylesheet”>
<link href=”css/response.css” rel=”stylesheet”>
<link rel=”stylesheet” href=”css/swiper.min.css”>

2. 引入JS

<script src=”http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js”></script>

<script src=”http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js”></script>

<script src=”js/jquery.min.js”></script>

<script src=”js/bootstrap.min.js”></script>

<script src=”js/swiper.min.js”></script>

3. HTML代码

<div class=”content”>
<!– Swiper –>

<div class=”swiper-container”>

<div class=”swiper-wrapper”>

<div class=”swiper-slide”>

<img src=”images/ban.jpg” />

</div>

<div class=”swiper-slide”>

<img src=”images/ban.jpg” />

</div>

<div class=”swiper-slide”>

<img src=”images/ban.jpg” />

</div>

<div class=”swiper-slide”>

<img src=”images/ban.jpg” />

</div>

<div class=”swiper-slide”>

<img src=”images/ban.jpg” />

</div>

</div>

<!– Add Pagination –>

<div class=”swiper-pagination”>

</div>

<!– Add Arrows –>

<div class=”swiper-button-next”>

</div>

<div class=”swiper-button-pv”>

</div>

</div>

<ul class=”indexNav”>

<li class=”in1 fl”>

<a href=”zhaipei.html”>

<strong class=”fl”>

宅配<br />

套餐</strong>

<img src=”images/icon1.png” class=”fr” />

</a>

</li>

<li class=”in2 fr”>

<a href=”zhaipei.html”>

<strong class=”fl”>

农场特供</strong>

<img src=”images/icon2.png” class=”fr” />

</a>

</li>

<div class=”clearfix”>

</div>

</ul>

<!–indexNav/–>

<!–<ul class=”indexNav”>

<li class=”in3 fl”>

<a href=”zhaipei.html”>

今日菜谱</a>

</li>

<li class=”in3 fl”>

<a href=”zhaipei.html”>

今日特价</a>

</li>

<li class=”in3 fl”>

<a href=”zhaipei.html”>

最新活动</a>

</li>

<div class=”clearfix”>

</div>

</ul>

indexNav/–>

<ul class=”indexNav”>

<li class=”in1 fr”>

<a href=”zhaipei.html” style=”padding:0; background:url(images/boluo.jpg) right bottom no-repeat;”>

</a>

</li>

<li class=”in2 fl”>

<a href=”zhaipei.html”>

<strong class=”fl”>

卡券专区</strong>

<img src=”images/icon3.png” class=”fr” />

</a>

</li>

<div class=”clearfix”>

</div>

</ul>

<!–indexNav/–>

<ul class=”indexNav”>

<li class=”in4 fl”>

<a href=”about.html”>

<img src=”images/icon4.png”/>

我的农场</a>

</li>

<li class=”in4 fl”>

<a href=”new.html”>

<img src=”images/icon5.png”/>

养生专家</a>

</li>

<li class=”in4 fl”>

<a href=”contact.html”>

<img src=”images/icon6.png”/>

走进农场</a>

</li>

<div class=”clearfix”>

</div>

</ul>

<!–indexNav/–>

</div>

<!–content–>

<div class=”height1″>

</div>

<div class=”footNav”>

<dl>

<a href=”index.html”>

<dt>

<span class=”glyphicon glyphicon-home”>

</span>

</dt>

<dd>

首页</dd>

</a>

</dl>

<dl>

<a href=”tel:021-60521286″>

<dt>

<span class=”glyphicon glyphicon-earphone”>

</span>

</dt>

<dd>

电话</dd>

</a>

</dl>

<dl>

<a href=”car.html”>

<dt>

<span class=”glyphicon glyphicon-shopping-cart”>

</span>

</dt>

<dd>

购物车</dd>

</a>

</dl>

<dl>

<a href=”reg.html”>

<dt>

<span class=”glyphicon glyphicon-user”>

</span>

</dt>

<dd>

会员</dd>

</a>

</dl>

</div>

<!–footNav/–>

<!– jQuery (necessary for Bootstrap’s JavaScript plugins) –>

<!– Include all compiled plugins (below), or include individual files as needed –>

<!–焦点轮换–>

<!– Swiper JS –>

<!– Initialize Swiper –>

<script>

var swiper = new Swiper(‘.swiper-container’, {
pagination: ‘.swiper-pagination’,
paginationClickable: true,
nextButton: ‘.swiper-button-next’,
pvButton: ‘.swiper-button-pv’,
spaceBetween: 30
});
</script>

下载地址

立即下载