<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Pantry's Best 派送喜悦</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="stylesheet" href="css/bootstrap.css">
<script src="js/jquery-3.2.1.js"> </script>
<script src="js/bootstrap.js"></script>
<script src="js/holder.js"></script>
<style>
@media(min-width: 992px){
.thumbnail {
border: none;
max-width: 130%;
height: auto
}
#mynav_content li{
margin-right: 30px;
color: white;
}
#select_nav{
margin-right: 20px;
}
}
@media (max-width: 768px) {
#select_nav {
margin-right: 20px;
}
#honeycarousel {
margin-top: 100px;
}
.logo {
margin-left: 120px;
margin-right: 50px;
}
#sina,#weixin,#goodslistimg{
display: none;
}
.thumbnail img {
border: none;
max-width:130%;
height: auto;
}
.thumbnail {
border: none;
max-width:130%;
height: auto
}
#footertext{
text-align: center;
}
#phonelogo{
}
/*#shoppingcar {*/
/*position: absolute;*/
/*font-size: 20px;*/
/*line-height: 30px;*/
/*text-align: center;*/
/*height: 30px;*/
/*width: 30px;*/
/**/
/*margin-left: 200px;*/
/*border-radius: 50%;*/
/*margin-top: 120px;*/
/*}*/
/*#shoppingcar:hover {*/
/**/
/*}*/
}
</style>
</head>
<body>
<nav class="navbar navbar-fixed-top" style="background-color: rgb(57, 12, 32)">
<div class="navbar-header">
<button class="navbar-toggle collapsed" data-toggle="collapse" data-target="#mynav">
<p style="color: white">未登录</p>
</button>
<a href="#" class="logo"><img src="img/logo.png" alt=""></a>
</div>
<div class="nav navbar-collapse collapse" id="mynav" >
<ul class="nav navbar-nav" id="mynav_content">
<li><a href="#">English</a></li>
<li>
<a href="#sub1" class="navbar-collapse"data-toggle="collapse">当前城市：北京<span class="glyphicon glyphicon-triangle-bottom"></span></a>
<ul id="sub1" class="collapse dropdown-menu">
<li><a href="#">杭州</a></li>
<li><a href="#">上海</a></li>
<li><a href="#">广州</a></li>
<li><a href="#">深圳</a></li>
</ul>
<li>
<a href="#sub2" class="navbar-collapse"data-toggle="collapse">产品列表<span class="glyphicon glyphicon-triangle-bottom"></span></a>
<ul id="sub2" class="collapse dropdown-menu" >
<li><a href="#">迪士尼</a></li>
<li><a href="#">蛋糕</a></li>
<li><a href="#">纸杯蛋糕</a></li>
<li><a href="#">礼盒</a></li>
<li><a href="#">挞</a></li>
<li><a href="#">派</a></li>
<li><a href="#">素食</a></li>
<li><a href="#">礼品卡</a></li>
</ul>
</li>
<li><a href="#">门店</a></li>
<li><a href="#">配送须知</a></li>
<li><a href="#">活动</a></li>
<li>
<a href="#sub3" class="navbar-collapse" data-toggle="collapse">关于<span class="glyphicon glyphicon-triangle-bottom"></span></a>
<ul id="sub3" class="collapse dropdown-menu">
<li>我们</li>
<li>会员</li>
<li>礼品卡</li>
</ul>
</li>
<li><a href="#">甜品台<img src="img/new_icon.png"></a></li>
</ul>
<ul class="nav navbar-nav navbar-right" id="select_nav">
<li><a href="#">登录</a></li>
<li><a href="#">注册</a></li>
<li><a href="#"><span class="glyphicon glyphicon-shopping-cart"></span></a></li>
</ul>
</div>
</nav>
<div class="carousel slide" data-ride="carousel" id="honeycarousel">
<!--创建图片容器 -->
<div class="carousel-inner">
<div class="item active">
<img src="img/1.jpg" alt="">
</div>
<div class="item">
<img src="img/2.jpg" alt="">
</div>
<div class="item">
<img src="img/3.jpg" alt="">
</div>
<div class="item">
<img src="img/4.jpg" alt="">
</div>
<div class="item">
<img src="img/5.jpg" alt="">
</div>
</div>
<!--创建小圆点容器 -->
<ol class="carousel-indicators">
<li data-target="#honeycarousel" data-slide-to="0"></li>
<li data-target="#honeycarousel" data-slide-to="1"></li>
<li data-target="#honeycarousel" data-slide-to="2"></li>
<li data-target="#honeycarousel" data-slide-to="3"></li>
<li data-target="#honeycarousel" data-slide-to="4"></li>
</ol>
<!--创建左右按钮容器 -->
<a href="#honeycarousel" class="carousel-control left" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a href="#honeycarousel" class="carousel-control right" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
<div class="container">
<div class="panel">
<div class="panel-heading">
<a href="#"><span class="glyphicon glyphicon-triangle-right"></span>产品列表</a>
</div>
</div>
<div class="row" id="row1">
<div class="col-md-3 col-xs-6">
<div class="thumbnail">
<img src="img/goods1.png" alt="">
<p><a href="#">迪士尼</a></p>
</div>
</div>
<div class="col-md-3 col-xs-6">
<div class="thumbnail">
<img src="img/goods2.png" alt="">
<p><a href="#">礼盒</a></p>
</div>
</div>
<div class="col-md-3 col-xs-6">
<div class="thumbnail">
<img src="img/goods3.jpg" alt="">
<p><a href="#">蛋糕</a></p>
</div>
</div>
<div class="col-md-3 col-xs-6">
<div class="thumbnail">
<img src="img/goods4.png" alt="">
<p><a href="#">挞</a></p>
</div>
</div>
</div>
<div class="panel">
<div class="panel-heading">
<a href="#"><span class="glyphicon glyphicon-triangle-right"></span>新品推出</a>
</div>
</div>
<div class="row" id="row2">
<div class="col-md-3 col-xs-6">
<div class="thumbnail">
<img src="img/goods6.jpg" alt="">
<p><a href="#"> 纯脆提拉米苏 6吋 ￥299 </a></p>
</div>
</div>
<div class="col-md-3 col-xs-6">
<div class="thumbnail">
<img src="img/goods7.jpg" alt="">
<p><a href="#"> 芒果空气感蛋糕 6吋 ￥249 </a></p>
</div>
</div>
<div class="col-md-3 col-xs-6">
<div class="thumbnail">
<img src="img/goods8.jpg" alt="">
<p><a href="#"> 荔枝玫瑰蛋糕 6吋 ￥299 </a></p>
</div>
</div>
<div class="col-md-3 col-xs-6">
<div class="thumbnail">
<img src="img/goods9.jpg" alt="">
<p><a href="#"> 素食迷你纸杯礼盒 礼盒 ￥199 </a></p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 col-xs-12" id="footertext">
<p><span class="glyphicon glyphicon-earphone" style="color=lightgreen"></span>4008-3-14159</p>
<p><span class="glyphicon glyphicon-envelope" style="color=lightgreen"></span>order@pantrysbest.com</p>
</div>
<div class="col-md-4">
<span><a href="#" id="sina" ><img src="img/sina.png" style=" margin-left:120px;margin-right: 20px;height: 30px;width: 30px"></a> <a href="#"><img src="img/weixin.png" id="weixin" style="height: 30px;width: 30px"></a></span>
</div>
<div class="col-md-4">
<img src="img/brand-icons1.png" id="goodslistimg" style="width: 200px;height: 30px;margin-left: 150px">
</div>
</div>
<div class="row">
<div class="col-md-12"style="text-align: center">
<p>北京市朝阳区神路街39号10幢3层4段92-93</p>
<p> Copyright 2010-2017 派悦坊，Ltd 京ICP备12046340</p>
</div>
</div>
</div>
</body>
</html>
