代码拉取完成，页面将自动刷新
<!doctype html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<title>风游美食，有你想游</title>
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/global.css">
<link rel="stylesheet" href="css/response.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/swiper.min.css">
<link rel="stylesheet" href="css/APlayer.min.css">
<link rel="shortcut icon" href="img/f.ico" type="image/x-icon">
</head>
<body>
<div class="container">
<!--左侧侧边栏-->
<div class="header">
<!--logo区-->
<div class="logo">
<a href="index.html"><img title="风游美食" src="img/logo.png"></a>
</div>
<!--搜索框-->
<div class="search">
<input type="text" placeholder="请输入关键字">
<button><i class="fa fa-search" aria-hidden="true"></i> 搜索</button>
</div>
<!--导航菜单-->
<ul class="nav">
<li class="nav-item"> <a href="index.html"> <i class="fa fa-home" aria-hidden="true"></i> 首页 </a> </li>
<li class="nav-item"> <a href="subhtml/sub_caipu.html" target="_blank"> <i class="fa fa-bars" aria-hidden="true"></i>
菜谱<span class="fa fa-angle-right" aria-hidden="true"></span> </a>
<ul class="subnav">
<li class="subnav-item"><a href="#">中餐</a></li>
<li class="subnav-item"><a href="#">西餐</a></li>
<li class="subnav-item"><a href="#">日料</a></li>
</ul>
</li>
<li class="nav-item"> <a href="subhtml/sub_shicai.html" target="_blank"> <i class="fa fa-apple" aria-hidden="true"></i>
食材<span class="fa fa-angle-right" aria-hidden="true"></span> </a>
<ul class="subnav">
<li class="subnav-item"><a href="#">蔬菜类</a></li>
<li class="subnav-item"><a href="#">肉类</a></li>
<li class="subnav-item"><a href="#">鲜果干果</a></li>
</ul>
</li>
<li class="nav-item"> <a href="#"> <i class="fa fa-heart-o" aria-hidden="true"></i> 健康<span
class="fa fa-angle-right" aria-hidden="true"></span> </a>
<ul class="subnav">
<li class="subnav-item"><a href="#">饮食常识</a></li>
<li class="subnav-item"><a href="#">失眠</a></li>
<li class="subnav-item"><a href="#">气血双补</a></li>
</ul>
</li>
<li class="nav-item"> <a href="#"> <i class="fa fa-th-large" aria-hidden="true"></i> 专题<span
class="fa fa-angle-right" aria-hidden="true"></span> </a>
<ul class="subnav">
<li class="subnav-item"><a href="#">美食随手拍</a></li>
<li class="subnav-item"><a href="#">妈妈派</a></li>
<li class="subnav-item"><a href="#">烘焙圈</a></li>
</ul>
</li>
<li class="nav-item"> <a href="subhtml/sub_shequ.html" target="_blank"> <i class="fa fa-users" aria-hidden="true"></i>
社区<span class="fa fa-angle-right" aria-hidden="true"></span> </a>
<ul class="subnav">
<li class="subnav-item"><a href="#">热门话题</a></li>
<li class="subnav-item"><a href="#">精华日志</a></li>
<li class="subnav-item"><a href="#">免费抽奖</a></li>
</ul>
</li>
<li class="nav-item"> <a href="#"> <i class="fa fa-ellipsis-h" aria-hidden="true"></i> 更多 </a> </li>
</ul>
<!--二维码-->
<div class="about">
<div class="about-text">风游美食 - 有你想游</div>
<div class="about-picture">
<div class="picture-a"> <img src="img/二维码.png" title="手机客户端"> <span>手机客户端</span> </div>
<div class="picture-b"> <img src="img/二维码.png" title="微信公众号"> <span>微信公众号</span> </div>
</div>
</div>
</div>
<!--中间内容-->
<div class="content">
<div class="main">
<!-- 小导航 -->
<div class="nav-2">
<ul>
<li><a class="a1" href="index.html">首页</a></li>
<li><a href="./subhtml/sub_caipu.html">菜谱</a></li>
<li><a href="./subhtml/sub_shicai.html">食材</a></li>
<li><a href="#">健康</a></li>
<li><a href="">专题</a></li>
<li><a class="a2" href="./subhtml/sub_shequ.html">社区</a></li>
</ul>
</div>
<!--轮播图-->
<!-- Swiper -->
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide"><a href="#"><img src="img/lunbo-1.png"></a></div>
<div class="swiper-slide"><a href="#"><img src="img/lunbo-2.png"></a></div>
<div class="swiper-slide"><a href="#"><img src="img/lunbo-3.png"></a></div>
<div class="swiper-slide"><a href="#"><img src="img/lunbo-4.png"></a></div>
<div class="swiper-slide"><a href="#"><img src="img/lunbo-5.png"></a></div>
<div class="swiper-slide"><a href="#"><img src="img/lunbo-6.png"></a></div>
</div>
<!-- Add Arrows -->
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
<!--推荐框-->
<div class="recommend">
<div class="rec-item">
<a href="#">早餐控最爱</a>
<div class="item-img1 img">
<div class="item-txt">不知道早餐吃什么好？快来看看小编准备的早餐集合吧，营养美味，让你365天早餐不重。</div>
</div>
</div>
<div class="rec-item">
<a href="#">西瓜的正确打开方式</a>
<div class="item-img2 img">
<div class="item-txt">夏天有三宝，西瓜、WiFi和空调，正式吃西瓜的季节，各种西瓜已经登场了，一起看看吧！</div>
</div>
</div>
<div class="rec-item">
<a href="#">立夏时节当养心</a>
<div class="item-img3 img">
<div class="item-txt">夏季属火，对应的脏腑为“心”，所以养心也成为夏季保健的一大关键点。宜清淡饮食哦～</div>
</div>
</div>
</div>
<!--热门-->
<div class="head-hot">
<h3>热门推荐</h3>
<div class="txt">
<a href="#">中餐</a>
<a href="#">西餐</a>
<a href="#">日料</a>
</div>
</div>
<div class="hot">
<div class="hot-item">
<a href="#">
<img src="img/hot-1.png" alt="">
<div class="txt">南瓜发糕</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-2.png" alt="">
<div class="txt">山楂红枣粥</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-3.png" alt="">
<div class="txt">奥尔良烤翅</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-4.png" alt="">
<div class="txt">芒果酸奶盘</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-5.png" alt="">
<div class="txt">红烧肉</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-6.png" alt="">
<div class="txt">爆浆芝士球</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-7.png" alt="">
<div class="txt">自制酸奶</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-8.png" alt="">
<div class="txt">自制蛋糕</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-9.png" alt="">
<div class="txt">煎饺</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-10.png" alt="">
<div class="txt">椰奶</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-11.png" alt="">
<div class="txt">孜然烤豆腐</div>
</a>
</div>
<div class="hot-item">
<a href="#">
<img src="img/hot-12.png" alt="">
<div class="txt">佛跳墙</div>
</a>
</div>
</div>
<!--页脚-->
<div class="footer">
<div class="about-text1">
<a href="#">关于我们</a><i>-</i>
<a href="#">联系我们</a><i>-</i>
<a href="#">加入我们</a><i>-</i>
<a href="#">服务说明</a><i>-</i>
<a href="#">友情链接</a><i>-</i>
<a href="#">网站地图</a><i>-</i>
<a href="#">移动应用</a>
</div>
<div class="about-text2">版权所有 © 2020-2020 风游美食 保留所有权利 - 京公网安备 1101050203****号 / 京ICP证09****号 /
京ICP备1002****号</div>
</div>
</div>
</div>
<!--右侧边框-->
<div class="right">
<!--天气-->
<div class="weather">
<iframe allowtransparency="true" frameborder="0" width="290" height="96" scrolling="no"
src="https://tianqi.2345.com/plugin/widget/index.htm?s=1&z=1&t=0&v=0&d=2&bd=0&k=&f=<f=009944&htf=cc0000&q=1&e=1&a=0&c=57073&w=290&h=96&align=center"></iframe>
</div>
<!--login-->
<div class="login">
<a class="login-1" href="subhtml/regist.html">注册</a>
<a class="login-2" href="subhtml/login.html">登录</a>
</div>
<!--search-->
<div class="search">
<h3>搜索</h3>
<div class="search-item">
<input type="text" placeholder="请输入关键字">
<button><i class="fa fa-search" aria-hidden="true"></i> 搜索</button>
</div>
</div>
<!--热门标签-->
<div class="tags">
<h3>热门标签</h3>
<ul>
<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>
<li>
<a href="#">免疫力</a>
</li>
<li>
<a href="3">蛋挞</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>
<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>
</div>
<!--时令食材-->
<div class="food">
<h3>时令食材</h3>
<div class="food-item">
<div class="item">
<ul>
<li><a href="#">1. 西瓜皮是保健良药</a></li>
<li><a href="#">2. 西瓜的五个新功效</a></li>
<li><a href="#">3. 吃西瓜的一百种吃法与摆盘</a></li>
<li>阅读（999+）</li>
</ul>
<img src="img/sl-1.png" alt="">
</div>
<div class="item">
<ul>
<li><a href="#">1. 小龙虾的营养分析</a></li>
<li><a href="#">2. 任何清洗、修剪小龙虾</a></li>
<li><a href="#">3. 小龙虾的九种做法</a></li>
<li>阅读（999+）</li>
</ul>
<img src="img/sl-2.png" alt="">
</div>
<div class="item">
<ul>
<li><a href="#">1. 排骨的营养价值与做法</a></li>
<li><a href="#">2. 降脂降压-木瓜花生排骨汤</a></li>
<li><a href="#">3. 清热去火-老藕排骨汤</a></li>
<li>阅读（999+）</li>
</ul>
<img src="img/sl-3.png" alt="">
</div>
<div class="item">
<ul>
<li><a href="#">1. 营养师推荐：夏季享用毛豆正当时</a></li>
<li><a href="#">2. 毛豆营养价值剖析</a></li>
<li><a href="#">3. 毛豆竟然还能这样吃？</a></li>
<li>阅读（999+）</li>
</ul>
<img src="img/sl-4.png" alt="">
</div>
<div class="item">
<ul>
<li><a href="#">1. 黄瓜八大功效 美容护肤益肾脏</a></li>
<li><a href="#">2. 负卡路里蔬菜-黄瓜</a></li>
<li><a href="#">3. 巧吃黄瓜治溃疡</a></li>
<li>阅读（999+）</li>
</ul>
<img src="img/sl-5.png" alt="">
</div>
<div class="item">
<ul>
<li><a href="#">1. 蛤蜊的营养价值与做法</a></li>
<li><a href="#">2. 蛤蜊的药用价值</a></li>
<li><a href="#">3. 蛤（蛤蜊、花蛤、文蛤）营养价值剖析</a></li>
<li>阅读（999+）</li>
</ul>
<img src="img/sl-6.png" alt="">
</div>
</div>
</div>
<!--音乐-->
<div class="music">
<h3>美食音乐欣赏</h3>
<div id="aplayer"></div>
</div>
</div>
</div>
<!-- Swiper JS -->
<script src="js/swiper.min.js"></script>
<script src="js/APlayer.min.js"></script>
<!-- Initialize Swiper -->
<script>
var swiper = new Swiper('.swiper-container', {
autoplay: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
autoplay: {
disableOnInteraction: false,
},
});
const ap = new APlayer({
container: document.getElementById('aplayer'),
audio: [{
name: '生僻字（美食版）',
artist: '馒头',
url: './music/馒头 - 生僻字 (美食版).mp3',
cover: './img/歌手.png'
}]
});
</script>
</body>
</html>
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手