html+css+简单的js制作的超市页面_html购物网站代码资源-CSDN文库

共44个文件

jpg：27个

png：12个

js：3个

html

javascript

57 浏览量 2023-09-12 22:17:10 上传评论 1 收藏 453KB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

超市模仿.rar （44个子文件）

超市模仿

menu.js 617B

banner.js 454B

jquery.min.js 91KB

img

bottom2.jpg 2KB

bottom10.png 619B

2.jpg 60KB

bottom9.png 931B

47.jpg 14KB

13.jpg 8KB

46.jpg 13KB

01.jpg 9KB

xsq.png 2KB

14.jpg 3KB

pic2.png 112B

1.jpg 81KB

152110718068231844.jpg 4KB

new-down-img.png 4KB

sptt_a.png 7KB

sptt.png 10KB

p4.jpg 10KB

p6.jpg 11KB

bottom8.jpg 4KB

bottom4.jpg 3KB

bottom5.jpg 2KB

12.jpg 8KB

index.png 11KB

20.jpg 14KB

11.jpg 12KB

bottom1.jpg 2KB

logo.jpg 5KB

29.jpg 16KB

p2.jpg 8KB

chaoshi.png 13KB

p3.jpg 8KB

38.jpg 15KB

bottom3.jpg 2KB

152480985414096131.jpg 23KB

p5.jpg 11KB

bottom7.png 951B

h5.png 4KB

bottom6.png 1017B

p1.jpg 37KB

css

style.css 12KB

index.html 9KB

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>小唐超市</title> <link rel="stylesheet" href="css/style.css"> </head>  <body>   <div class="nav"> <div class="typearea"> <div class="nav_left"> <a href="#"> 返回首页</a> <a href="#">网站导航</a> <a href="#">商家入驻</a> <a href="#">客户服务</a> </div> <div class="nav_right"> <a href="#"> 请登录</a> <a href="#"> 注册有礼</a> <a href="#"> 我的订单</a> <a href="#"> 我的易购</a> <a href="#"> 小唐会员</a> <a href="#"> 购物车</a> <a href="#"> 易付宝</a> <a href="#"> 企业采购</a> <a href="#"> 手机小唐</a> </div> </div> </div>   <div class="content_top"> <div class="typearea"> <div class="logo"> <img src="img/logo.jpg" alt="" /> </div> <div class="content_top_center"> <div class="search"> <span><i class="iconfont icon-search"></i></span><input type="text" id="placehold"/><a href="javascript:;" class="submit">搜索</a> <ul id="ss_uo"> </ul> </div> <div class="search_ul"> <ul> <li><a href="javascript:;">啤酒</a></li><img src="img/pic2.png" alt="" /> <li class="horange"><a href="javascript:;">小罐茶</a></li><img src="img/pic2.png" alt="" /> <li><a href="javascript:;">阿胶糕</a></li><img src="img/pic2.png" alt="" /> <li class="horange"><a href="javascript:;">怡宝</a></li><img src="img/pic2.png" alt="" /> <li class="horange"><a href="javascript:;">维达</a></li><img src="img/pic2.png" alt="" /> <li><a href="javascript:;">松露巧克力</a></li><img src="img/pic2.png" alt="" /> <li><a href="javascript:;">胡姬花</a></li><img src="img/pic2.png" alt="" /> <li><a href="javascript:;">防晒霜</a></li><img src="img/pic2.png" alt="" /> <li><a href="javascript:;">伊萨狗粮</a></li><img src="img/pic2.png" alt="" /> <li><a href="javascript:;">清扬</a></li> </ul> </div> </div> <div class="code"> <img src="img/new-down-img.png" alt="" /> </div> </div> </div>  <div class="sort"> <div class="sort_pop"> <div class="sort_tit"> <i class="iconfont icon-caidan"></i> <a href="javascript:;">苏苏超市频道分类</a> </div> <div class="sort_ul"> <ul> <li><a href="javascript:;">超值抢购</a></li><span></span> <li><a href="javascript:;">量贩巨惠</a></li><span></span> <li><a href="javascript:;">苏苏生鲜</a></li><span></span> <li><a href="javascript:;">医药保健</a></li><span></span> <li><a href="javascript:;">特色馆</a></li><span></span> </ul> </div> </div> </div> <div class="content">  <div class="content_nav"> <ul> <li><i class=" c_n_i"></i><span class="c_n_s1"><a href="javascript:;" class="c_n_l">苏苏生鲜</a></span><span class="c_n_s2"><a href="javascript:;">水果</a><a href="javascript:;">海鲜水产</a></span></li> <li><i class="c_n_i"></i><span class="c_n_s1"><a href="javascript:;" class="c_n_l">酒水饮料</a></span><span class="c_n_s2"><a href="javascript:;">红酒</a><a href="javascript:;">酸奶</a><a href="javascript:;">咖啡</a></span></li> <li><i class="c_n_i"></i><span class="c_n_s1"><a href="javascript:;" class="c_n_l">粮油干货零食</a></span><span class="c_n_s2"><a href="javascript:;">食用油</a><a href="javascript:;">坚果蜜饯</a></span></li> <li><i class="c_n_i"></i><span class="c_n_s1"><a href="javascript:;" class="c_n_l">纸品清洁</a></span><span class="c_n_s2"><a href="javascript:;">抽纸</a><a href="javascript:;">洗衣液</a><a href="javascript:;">卷纸</a><a href="javascript:;">柔顺剂</a></span></li> <li><i class="c_n_i"></i><span class="c_n_s1"><a href="javascript:;" class="c_n_l">美妆个护</a></span><span class="c_n_s2"><a href="javascript:;">洗面奶</a><a href="javascript:;">洗护</a><a href="javascript:;">面膜</a><a href="javascript:;">姨妈巾</a></span></li> <li><i class="c_n_i"></i><span class="c_n_s1"><a href="javascript:;" class="c_n_l">医药保健</a></span><span class="c_n_s2"><a href="javascript:;">血压计</a><a href="javascript:;">成人用品</a></span></li> </ul> </div>  <div class="content_nav_r"> <div class="c_n_r_t"> <ul> <li><a href="javascript:;"><em></em><p>牛奶的妙用</p></a></li> <li><a href="javascript:;"><em></em><p>小龙虾千万别吃头</p></a></li> <li><a href="javascript:;"><em></em><p>1克干燕窝等于40颗蛋</p></a></li> </ul> </div> <div class="c_n_r_b"> <a href="javascript:;"><img src="img/sptt_a.png" alt=""></a> </div> </div>  <div id="container"> <ul > <li><a href="javascript:;"><img src="img/1.jpg" ></a></li> </ul> </div> </div>  <div class="buy_tit"> <p>限/时/抢/购</p> <p>FLASH SALE</p> </div>  <div class="buy"> <p class="buy_p" >距离本场结束还有</p> <div class="buy_time"> <em>00</em> <em>00</em> <em>00</em> </div> <div class="buy_nav"> <ul> <li class="active"> <a href="javascript:;">今日必抢</a> </li> <li> <a href="javascript:;">明日预告</a> </li> </ul> </div> <div class="lazy"> <div class="lazy_t"> <ul class="lazy_t_ul active"> <li><a href="javascript:;"><p class="lazy_t_p1">￥79.90</p><img src="img/01.jpg" alt=""><p class="lazy_name">金龙鱼葵花籽食用调和油 5L</p><p class="lazy_num">已抢购<span class="num_span">79</span>%</p><span class="num_man"><i></i></span></a></li> <li><a href="javascript:;"><p class="lazy_t_p1">￥69.90</p><img src="img/01.jpg" alt=""><p class="lazy_name">木龙鱼葵花籽食用调和油 5L</p><p class="lazy_num">已抢购<span class="num_span">79</span>%</p><span class="num_man"><i></i></span></a></li> <li><a href="javascript:;"><p class="lazy_t_p1">￥59.90</p><img src="img/01.jpg" alt=""><p class="lazy_name">水龙鱼葵花籽食用调和油 5L</p><p class="lazy_num">已抢购<span class="num_span">79</span>%</p><span class="num_man"><i></i></span></a></li> <li><a href="javascript:;"><p class="lazy_t_p1">￥49.90</p><img src="img/01.jpg" alt=""><p class="lazy_name">火龙鱼葵花籽食用调和油 5L</p><p class="lazy_num">已抢购<span class="num_span">79</span>%</p><span class="num_man"><i></i></span></a></li> <li><a href="javascript:;"><p class="lazy_t_p1">￥39.90</p><img src="img/01.jpg" alt=""><p class="lazy_name">土龙鱼葵花籽食用调和油 5L</p><p class="lazy_num">已抢购<span class="num_span">79</span>%</p><span class="num_man"><i></i></span></a></li> </ul> <ul class="lazy_t_ul" > <li><a href="javascript:;"><p class="lazy_t_p1">￥149.90</p><img src="img/01.jpg" alt=""><p class="lazy_name">天龙鱼葵花籽食用调和油 5L</p><p class="lazy_num">已抢购<span class="num_span">79</span>%</p><span class="num_man"><i></i></span></a></li> <li><a href="javascript:;"><p class="lazy_t_p1">￥139.90</p><img src="img/01.jpg" alt=""><p class="lazy_name">地龙鱼葵花籽食用调和油 5L</p><p class="lazy_num">已抢购<span class="num_span">79</span>%</p><span class="num_man"><i></i></span></a></li> <li><a href="javascript:;"><p class="lazy_t_p1">￥129.90</p><img src="img/01.jpg" alt=""><p clas

评论收藏

内容反馈