<!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" ></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" > </div> <div class="item"> <img src="img/2.jpg" > </div> <div class="item"> <img src="img/3.jpg" > </div> <div class="item"> <img src="img/4.jpg" > </div> <div class="item"> <img src="img/5.jpg" > </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" > <p><a href="#">迪士尼</a></p> </div> </div> <div class="col-md-3 col-xs-6"> <div class="thumbnail"> <img src="img/goods2.png" > <p><a href="#">礼盒</a></p> </div> </div> <div class="col-md-3 col-xs-6"> <div class="thumbnail"> <img src="img/goods3.jpg" > <p><a href="#">蛋糕</a></p> </div> </div> <div class="col-md-3 col-xs-6"> <div class="thumbnail"> <img src="img/goods4.png" > <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" > <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" > <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" > <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" > <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>[email protected]</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>
时间: 2024-10-07 16:21:43