HTML静态网页成品作业(HTML+CSS)—— 零食商城网页(1个页面)

🎉不定期分享源码，关注不丢失哦

一、作品介绍

🏷️本套采用HTML+CSS，未使用Javacsript代码，共有1个页面。

二、作品演示

三、代码目录

四、网站代码

HTML部分代码

<div class="mainHeader"><img src="./images/logo.png" alt="" class="logo"><div class="mainSearch"><form action=""><input type="text" placeholder="请输入要搜索的零食"><button>搜索</button></form></div></div><div class="mainNav"><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 class="last"><a href="">注册登录</a></li></ul></div><div class="mainBanner"><img src="./images/banner.jpg" alt=""></div><div class="mainContent"><div class="mainContentTitle"><div class="left">热门食品</div></div><div class="mainContentList"><div class="mainContentOne"><div class="mainContentOneImg"><img src="./images/ls_1.png" alt=""></div><div class="mainContentOneName">张君雅鸡汁拉面条饼</div><div class="mainContentOnePrice">¥7.0</div></div><div class="mainContentOne"><div class="mainContentOneImg"><img src="./images/ls_2.png" alt=""></div><div class="mainContentOneName">可瑞安粒粒蹦脆麦仁</div><div class="mainContentOnePrice">¥9.5</div></div><div class="mainContentOne"><div class="mainContentOneImg"><img src="./images/ls_3.png" alt=""></div><div class="mainContentOneName">海牌海苔1*8</div><div class="mainContentOnePrice">¥9.9</div></div><div class="mainContentOne"><div class="mainContentOneImg"><img src="./images/ls_4.png" alt=""></div><div class="mainContentOneName">张君雅草莓味甜甜圈</div><div class="mainContentOnePrice">¥7.5</div></div><div class="mainContentOne"><div class="mainContentOneImg"><img src="./images/ls_5.png" alt=""></div><div class="mainContentOneName">朱蒂丝巧克力味蛋卷120g</div><div class="mainContentOnePrice">¥16.9</div></div></div>

五、源码获取

🥇 ~ 关注我，点赞博文~ 每天带你涨知识!
🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧，你的「点赞，好评，收藏」是我创作的动力。
💙2.想要获取本文源码，点击前往吧