🎉
不定期分享源码，关注不丢失哦
文章目录
- 一、作品介绍
- 二、作品演示
- 三、代码目录
- 四、网站代码
- 五、源码获取
一、作品介绍
🏷️本套采用DIV+CSS布局，未使用Javacsript代码，共有8个页面。
二、作品演示
三、代码目录
四、网站代码
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="./css/style.css"> </head> <body> <!-- 顶部 --> <div class="top"> <div class="w"> <div class="top_left"> <img src="./images/icon_dingwei.png" class="icon"> <span>北京</span> <a href="">[更换]</a> </div> <div class="top_right"> <a href="login.html">你好，请登录/注册</a> </div> </div> </div> <!-- 头部 --> <div class="header"> <div class="w"> <div class="logo"> <a href="index.html"> <img src="./images/logo.png"> </a> </div> <div class="search"> <input type="text" name="" placeholder="搜素商家或美食"> <button> <img src="./images/icon_search.png" class="icon"> </button> </div> <div class="header_right"></div> </div> <div class="w header2"> <div class="cate_all"> 全部分类 </div> <ul class="nav"> <li><a href="shangjia.html">全部商家</a></li> <li><a href="ruzhu.html">商家入驻</a></li> <li><a href="aboutus.html">关于我们</a></li> <li><a href="ques.html">常见问题</a></li> <li><a href="login.html">我要登录</a></li> <li><a href="fankui.html">用户反馈</a></li> </ul> </div> </div> <div class="main"> <!-- 广告 --> <div class="banenr"> <div class="w"> <ul class="cats"> <li> <a href="">美食</a> <a href="" class="sm_link">汉堡薯条</a> <a href="" class="sm_link">披萨</a> </li> <li><a href="">超市便利</a> <a href="" class="sm_link">时令鲜果</a> <a href="" class="sm_link">牛奶酸奶</a></li> <li><a href="">甜点饮品</a> <a href="" class="sm_link">生日蛋糕</a> <a href="" class="sm_link">奶茶</a></li> <li><a href="">蔬菜水果</a> <a href="" class="sm_link">果捞</a> <a href="" class="sm_link">蔬菜肉禽</a></li> <li><a href="">早餐</a> <a href="" class="sm_link">地方小吃</a> <a href="" class="sm_link">豆浆</a></li> <li><a href="">正餐优选</a> <a href="" class="sm_link">快餐</a> <a href="" class="sm_link">日韩料理</a></li> <li><a href="">夜宵</a> <a href="" class="sm_link">香锅烤鱼</a> <a href="" class="sm_link">火锅</a></li> <li><a href="">甜蜜蛋糕</a> <a href="" class="sm_link">美味蛋糕</a> <a href="" class="sm_link">甜点</a></li> <li><a href="">家常菜</a> <a href="" class="sm_link">口味川湘</a> <a href="" class="sm_link">北方佳肴</a></li> <li><a href="">快食简餐</a> <a href="" class="sm_link">盖饭</a> <a href="" class="sm_link">便当寿司</a></li> <li><a href="">日韩料理</a> <a href="" class="sm_link">炸鸡</a> <a href="" class="sm_link">韩国料理</a></li> <li><a href="">小吃馆</a> <a href="" class="sm_link">快餐小吃</a> <a href="" class="sm_link">韩国料理</a></li> </ul> <div class="banner_img"> <img src="./images/banner.jpg" > </div> </div> </div> <!-- 推荐商家 --> <div class="sj ilist_wrapper"> <div class="w"> <div class="tit"> <span>推荐商家</span> <a href="">更多</a> </div> <div class="list"> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj1.jpg"> </div> <div class="item_name"> 逗思都吃韩国料理 </div> <div class="item_tuijian"> 推荐菜：<span>自制金枪鱼饭团</span><span>奶酪辣鸡</span> </div> <div class="item_price"> 起送 <span>￥95</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj2.jpg"> </div> <div class="item_name"> 铃木食堂 </div> <div class="item_tuijian"> 推荐菜：<span>杏仁豆腐</span><span>金枪鱼沙拉</span> </div> <div class="item_price"> 起送 <span>￥65</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj3.jpg"> </div> <div class="item_name"> 蘇飯 </div> <div class="item_tuijian"> 推荐菜：<span>赛螃蟹</span><span>红烧肉</span> </div> <div class="item_price"> 起送 <span>￥25</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj4.jpg"> </div> <div class="item_name"> THE TACO BAR </div> <div class="item_tuijian"> 推荐菜：<span>玉米片牛油果</span><span>牛舌Taco</span> </div> <div class="item_price"> 起送 <span>￥195</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj5.jpg"> </div> <div class="item_name"> 聚宝源 </div> <div class="item_tuijian"> 推荐菜：<span>一品烧饼</span><span>涮羊肉</span> </div> <div class="item_price"> 起送 <span>￥35</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj6.jpg"> </div> <div class="item_name"> 芝乐坊餐厅 </div> <div class="item_tuijian"> 推荐菜：<span>芝士蛋糕</span><span>杂烩浓汤饭</span> </div> <div class="item_price"> 起送 <span>￥32</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj7.jpg"> </div> <div class="item_name"> 南门涮肉 </div> <div class="item_tuijian"> 推荐菜：<span>热气羊肉</span><span>自制烧饼</span> </div> <div class="item_price"> 起送 <span>￥161</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj8.jpg"> </div> <div class="item_name"> Bada kitchen 和风洋食 </div> <div class="item_tuijian"> 推荐菜：<span>紫苏卷</span><span>蒲烧鳗鱼饭</span> </div> <div class="item_price"> 起送 <span>￥129</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj9.jpg"> </div> <div class="item_name"> 淮扬府 </div> <div class="item_tuijian"> 推荐菜：<span>响油鳝糊</span><span>扬州大煮干丝</span> </div> <div class="item_price"> 起送 <span>￥162</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj10.jpg"> </div> <div class="item_name"> 隐厨·中国菜馆 </div> <div class="item_tuijian"> 推荐菜：<span>时尚肉汤泡饭</span><span>贵州黄牛肉</span> </div> <div class="item_price"> 起送 <span>￥135</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj11.jpg"> </div> <div class="item_name"> 潇湘阁 </div> <div class="item_tuijian"> 推荐菜：<span>小炒肉</span><span>酸辣鸡胗</span> </div> <div class="item_price"> 起送 <span>￥80</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj12.jpg"> </div> <div class="item_name"> Home Thai·泰谣 </div> <div class="item_tuijian"> 推荐菜：<span>绿咖喱鸡</span><span>芒果糯米饭</span> </div> <div class="item_price"> 起送 <span>￥45</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj13.jpg"> </div> <div class="item_name"> 萃華楼 </div> <div class="item_tuijian"> 推荐菜：<span>特色烤花卷</span><span>芙蓉鸡片</span> </div> <div class="item_price"> 起送 <span>￥125</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj14.jpg"> </div> <div class="item_name"> 燕郊烧鸽子 </div> <div class="item_tuijian"> 推荐菜：<span>晾衣大饼</span><span>烤鸽子</span> </div> <div class="item_price"> 起送 <span>￥195</span> </div> </a> </div> <div class="item"> <a href="shangjia_detail.html"> <div class="item_img"> <img src="./images/sj15.jpg"> </div> <div class="item_name"> 捞王锅物料理 </div> <div class="item_tuijian"> 推荐菜：<span>绣球豆腐</span><span>手工鲜虾滑</span> </div> <div class="item_price"> 起送 <span>￥235</span> </div> </a> </div> </div> </div> </div> </div> <div class="footer"> <div class="w"> <div class="footer_list"> <a href="">关于我们</a> <span>|</span> <a href="">商户诚信公约</a> <span>|</span> <a href="">规则中心</a> <span>|</span> <a href="">媒体报道</a> <span>|</span> <a href="">商户入驻</a> <span>|</span> <a href="">推广服务</a> <span>|</span> <a href="">人才招聘</a> <span>|</span> <a href="">最新咨询</a> <span>|</span> <a href="">联系我们</a> <span>|</span> <a href="">应用下载</a> </div> <div class="footer_copyright"> ©2003-2022 外卖人, All Rights Reserved </div> </div> </div> </body> </html>
五、源码获取
🥇 ~ 关注我，点赞博文~ 每天带你涨知识!
🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧，你的「点赞，好评，收藏」是我创作的动力。
💙2.想要获取本文源码，点击前往吧
