當(dāng)前位置：首頁(yè) > 前端技术 > HTML >内容正文

HTML

HTML5期末大作业：服装购物网站设计——粉色服装购物商城(4页) 服装购物商城网页设计作品大学生购物专题网页设计作业模板商店静态HTML网页模板下载

發(fā)布時(shí)間：2024/3/26 HTML 48 豆豆

生活随笔收集整理的這篇文章主要介紹了 HTML5期末大作业：服装购物网站设计——粉色服装购物商城(4页) 服装购物商城网页设计作品大学生购物专题网页设计作业模板商店静态HTML网页模板下载小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

HTML5期末大作業(yè)：服裝購(gòu)物網(wǎng)站設(shè)計(jì)——粉色服裝購(gòu)物商城(4頁(yè)) 服裝購(gòu)物商城網(wǎng)頁(yè)設(shè)計(jì)作品大學(xué)生購(gòu)物專題網(wǎng)頁(yè)設(shè)計(jì)作業(yè)模板商店靜態(tài)HTML網(wǎng)頁(yè)模板下載

常見(jiàn)網(wǎng)頁(yè)設(shè)計(jì)作業(yè)題材有個(gè)人、美食、公司、學(xué)校、旅游、電商、寵物、電器、茶葉、家居、酒店、舞蹈、動(dòng)漫、明星、服裝、體育、化妝品、物流、環(huán)保、書(shū)籍、婚紗、軍事、游戲、節(jié)日、戒煙、電影、攝影、文化、家鄉(xiāng)、鮮花、禮品、汽車、其他等網(wǎng)頁(yè)設(shè)計(jì)題目, A+水平作業(yè), 可滿足大學(xué)生網(wǎng)頁(yè)大作業(yè)網(wǎng)頁(yè)設(shè)計(jì)需求, 喜歡的可以下載!

🧡作者主頁(yè)-更多源碼

🧡HTML期末大作業(yè)文章專欄

作品介紹

1.網(wǎng)頁(yè)作品簡(jiǎn)介 ：HTML期末大學(xué)生網(wǎng)頁(yè)設(shè)計(jì)作業(yè) A+水平 ,喜歡的可以下載，文章頁(yè)支持手機(jī)PC響應(yīng)式布局。

2.網(wǎng)頁(yè)作品編輯：作品下載后可使用任意HTML編輯軟件（如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm、 Notepad++ 等任意HTML軟件編輯修改網(wǎng)頁(yè)）。

3.網(wǎng)頁(yè)作品技術(shù)：Div+CSS、鼠標(biāo)滑過(guò)特效、Table、導(dǎo)航欄效果、banner、表單、二級(jí)三級(jí)頁(yè)面等，視頻、音頻元素、Flash，同時(shí)設(shè)計(jì)了logo（源文件），基本期末作業(yè)所需的知識(shí)點(diǎn)全覆蓋。

文章目錄

HTML5期末大作業(yè)：服裝購(gòu)物網(wǎng)站設(shè)計(jì)——粉色服裝購(gòu)物商城(4頁(yè)) 服裝購(gòu)物商城網(wǎng)頁(yè)設(shè)計(jì)作品大學(xué)生購(gòu)物專題網(wǎng)頁(yè)設(shè)計(jì)作業(yè)模板商店靜態(tài)HTML網(wǎng)頁(yè)模板下載
作品介紹
一、作品展示
二、文件目錄
三、代碼實(shí)現(xiàn)
四、學(xué)習(xí)資料
五、更多源碼

一、作品展示

二、文件目錄

三、代碼實(shí)現(xiàn)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>詳細(xì)頁(yè)面</title> <meta name="keywords" content="[!--pagekey--]" /> <meta name="description" content="[!--pagedes--]" /> <link href="images/all.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/myfocus-2.0.1.min.js"></script> <script type="text/javascript" src="js/SuperSlide.js"></script> </head><body> <header><div class="nav"><ul><li class="li1"><a>海</a></li><li class="li2"><a>拼</a></li></ul> </div><div class="head"><div class="top"><div class="wrapper"><div class="logo fl"><a href="index.html"><img src="images/logo.png" /></a></div><div class="dl fr"><ul><li>歡迎您,DGL</li><li><a href="">退出</a></li><li><a href="">個(gè)人中心</a></li><li><a href="">我的訂單</a></li><li><a href="login.html">登錄</a></li><li><a href="">注冊(cè)</a></li></ul><div class="sousuo"><input class="index_srh" name="keyboard" value="請(qǐng)輸入您要查找的商品" onBlur="if(this.value=='') this.value='請(qǐng)輸入您要查找的商品';" onFocus="if(this.value=='請(qǐng)輸入您要查找的商品') this.value='';"><input class="search" type="submit" name="submit" value="搜索"></div></div></div></div><div class="menu"><div class="wrapper"><ul><li class="li1"><a href="piclist.html" class="on">全部分類</a></li><li class="li2"><a href="index.html">首頁(yè)</a></li><li class="li3"><a href="piclist.html">潮流單品</a></li><li class="li4"><a href="piclist.html">衣服</a></li><li class="li5"><a href="piclist.html">鞋子</a></li><li class="li6"><a href="piclist.html">包包</a></li><li class="li7"><a href="piclist.html">配飾</a></li><li class="li8"><a href="piclist.html">潮流單品</a></li><li class="li9"><a href="piclist.html">衣服</a></li><li class="li10"><a href="piclist.html">鞋子</a></li><li class="li11"><a href="piclist.html">包包</a></li><li class="li12"><a href="piclist.html">配飾</a></li></ul></div></div></div> </header><div class="xiangqing"><div class="shangjiaming"><div class="wrapper"><div class="fl left">小Y包袋</div><div class="fr right"><span class="fl"><a href="">+關(guān)注本店</a></span><span class="fl">409粉絲</span></div></div></div><div class="sj-wrapper"><div class="sj-logo"><img src="images/shangjia-logo.jpg" /></div><div class="menu"><a href="">首頁(yè)</a><a href="">多功能</a><a href="">單肩/手提</a><a href="">大包包</a><a href="">小包</a></div><div class="game163 fl"><ul class="bigImg"><li><a href="" target="_blank"><img src="images/pic1.jpg" /></a><h4><a href="" target="_blank">美女玩家獵魔人 Cosplay</a></h4></li><li><a href="" target="_blank"><img src="images/pic2.jpg" /></a><h4><a href="#">《第2次機(jī)戰(zhàn)OG》魔裝機(jī)神系機(jī)體情報(bào)</a></h4></li><li><a href="" target="_blank"><img src="images/pic3.jpg" /></a><h4><a href="#">Dreamhack冬季賽：Hero奪冠香檳狂歡</a></h4></li><li><a href="" target="_blank"><img src="images/pic4.jpg" /></a><h4><a href="#">妹子戰(zhàn)喪尸！Bioware王牌畫(huà)師插畫(huà)賞</a></h4></li><li><a href="" target="_blank"><img src="images/pic5.jpg" /></a><h4><a href="#">《刺客信條3》簡(jiǎn)體中文版已送審</a></h4></li><li><a href="" target="_blank"><img src="images/list1.jpg" /></a><h4><a href="#">《上古世紀(jì)》中文版截圖獨(dú)家曝光</a></h4></li><li><a href="" target="_blank"><img src="images/list2.jpg" /></a><h4><a href="#">本周精選大濕級(jí)Cos欣賞佐助親吻小櫻</a></h4></li><li><a href="" target="_blank"><img src="images/list3.jpg" /></a><h4><a href="#">《斗仙》11月29日封測(cè) 試玩截圖首曝</a></h4></li></ul><div class="smallScroll"><a class="sPrev" href="javascript:void(0)">←</a><div class="smallImg"><ul><li><a><img src="images/pic1.jpg" /></a></li><li><a><img src="images/pic2.jpg" /></a></li><li><a><img src="images/pic3.jpg" /></a></li><li><a><img src="images/pic4.jpg" /></a></li><li><a><img src="images/pic5.jpg" /></a></li><li><a><img src="images/list1.jpg" /></a></li><li><a><img src="images/list2.jpg" /></a></li><li><a><img src="images/list3.jpg" /></a></li></ul></div><a class="sNext" href="javascript:void(0)">→</a></div><div class="pageState"></div></div><div class="jieshao fr"><div class="title">韓版糖果色迷你鏈條小包</div><div class="by"><div class="fl"><a href=""><img src="images/tx.jpg" /></a></div><div class="fr"><p>辣辣</p><p><span class="b1"> </span><span>你是否也在尋找一款簡(jiǎn)約卻絕不簡(jiǎn)單的包包，多種色彩多搭配，散發(fā)一種低調(diào)的時(shí)尚感。</span><span class="b2"> </span></p></div></div><div class="jg clearfix"><ul><li><span class="short">價(jià) 格</span><span class="price red">￥49.28</span><span class="btn">限時(shí)5.6折</span><span class="btn">免運(yùn)費(fèi)</span></li><li><span class="short">原價(jià)</span><span class="yj">￥88.00</span></li><li><span class="short">促銷</span><span class="btn">限時(shí)折扣</span><span>本商品參與店鋪限時(shí)5.6折優(yōu)惠</span></li><li><span class="short"> </span><span class="btn">微信直減</span><span>每日首單使用微信支付立減10元！</span><a href="" class="red">點(diǎn)擊查看</a></li><li><span class="short">運(yùn) 費(fèi)</span><span>包郵</span></li><li><span class="short">銷量</span><span>共售出3299件</span></li><li><span class="short">喜歡</span><span>有6789人喜歡該商品</span></li><li><span class="short">評(píng) 分</span><span class="star"> </span>4.5分（已有<a href="">14人評(píng)價(jià)</a>，<a href="">2條曬單</a>）</li><li><span class="short">顏色</span><span class="img"><img src="images/1.1.jpg" /></span><span class="img"><img src="images/1.2.jpg" /></span><span class="img"><img src="images/1.3.jpg" /></span></li><li><span class="short">數(shù) 量</span><span class="jian"></span><span><input type="text" class="num" value="1" /></span><span class="jia"></span></li><li><span class="short">客服</span><span class="border kf">商家客服</span></li></ul></div><div class="btn_box"><div class="fl"><a href="" class="jiaru"><em></em>加入購(gòu)物車</a><a href="" class="like"><em></em>立刻購(gòu)買(mǎi)</a></div></div></div><div class="clearfix"></div></div><div class="sj-center sj-wrapper clearfix"><ul><li><a href=""><img src="images/pc_bao_new.png" /></a><p class="da"><a href="">全場(chǎng)免運(yùn)費(fèi)</a></p><p><a href="">無(wú)最低消費(fèi)限制</a></p></li><li><a href=""><img src="images/pc_seven_new.png" /></a><p class="da"><a href="">七天無(wú)理由退款</a></p><p><a href="">輕松購(gòu)物有保障</a></p></li><li><a href=""><img src="images/pc_pei_new.png" /></a><p class="da"><a href="">退貨補(bǔ)貼運(yùn)費(fèi)</a></p><p><a href="">輕松購(gòu)物有保障</a></p></li><li><a href=""><img src="images/pc_fan_new.png" /></a><p class="da"><a href="">先行賠付</a></p><p><a href="">輕松購(gòu)物有保障</a></p></li></ul></div><div class="renqi sj-wrapper"><div class="title">人氣單品</div><ul><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚潮流小包可以單肩斜挎</a></p><p class="p2"><em class="em1">￥28.00</em></p><p class="p3">4637人已購(gòu)買(mǎi)</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚潮流小包可以單肩斜挎</a></p><p class="p2"><em class="em1">￥28.00</em></p><p class="p3">4637人已購(gòu)買(mǎi)</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚<td>晶***2（匿名）</td><td align="center" valign="middle">1</td><td align="center" valign="middle">2014-03-20 10:49:17</td><td align="center" valign="middle">酒紅色（升級(jí)加強(qiáng)版）新品現(xiàn)貨</td></tr><tr><td>晶***2（匿名）</td><td align="center" valign="middle">1</td><td align="center" valign="middle">2014-03-20 10:49:17</td><td align="center" valign="middle">酒紅色（升級(jí)加強(qiáng)版）新品現(xiàn)貨</td></tr><tr><td>晶***2（匿名）</td><td align="center" valign="middle">1</td><td align="center" valign="middle">2014-03-20 10:49:17</td><td align="center" valign="middle">酒紅色（升級(jí)加強(qiáng)版）新品現(xiàn)貨</td></tr><tr><td>晶***2（匿名）</td><td align="center" valign="middle">1</td><td align="center" valign="middle">2014-03-20 10:49:17</td><td align="center" valign="middle">酒紅色（升級(jí)加強(qiáng)版）新品現(xiàn)貨</td></tr></table></ul><ul><div class="shouqian"><dl><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">購(gòu)物狂狂狂人</a></p><p>包包控的童鞋來(lái)這里,價(jià)格超實(shí)惠,人也很好! Q:170813916,V信:wx480021,更多優(yōu)惠盡請(qǐng)期待...</p></div><div class="fr">2013-10-10</div><p class="hf"><a href="">回復(fù)</a></p></dd><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">購(gòu)物狂狂狂人</a></p><p>包包控的童鞋來(lái)這里,價(jià)格超實(shí)惠,人也很好! Q:170813916,V信:wx480021,更多優(yōu)惠盡請(qǐng)期待...</p></div><div class="fr">2013-10-10</div><p class="hf"><a href="">回復(fù)</a></p></dd><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">購(gòu)物狂狂狂人</a></p><p>包包控的童鞋來(lái)這里,價(jià)格超實(shí)惠,人也很好! Q:170813916,V信:wx480021,更多優(yōu)惠盡請(qǐng)期待...</p></div><div class="fr">2013-10-10</div><p class="hf"><a href="">回復(fù)</a></p></dd><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">購(gòu)物狂狂狂人</a></p><p>包包控的童鞋來(lái)這里,價(jià)格超實(shí)惠,人也很好! Q:170813916,V信:wx480021,更多優(yōu)惠盡請(qǐng)期待...</p></div><div class="fr">2013-10-10</div><p class="hf"><a href="">回復(fù)</a></p></dd><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">購(gòu)物狂狂狂人</a></p><p>包包控的童鞋來(lái)這里,價(jià)格超實(shí)惠,人也很好! Q:170813916,V信:wx480021,更多優(yōu)惠盡請(qǐng)期待...</p></div><div class="fr">2013-10-10</div><p class="hf"><a href="">回復(fù)</a></p></dd><dd class="clearfix"><div class="fl"><img src="images/tx2.jpg" /></div><div class="fl"><p><a href="">購(gòu)物狂狂狂人</a></p><p>包包控的童鞋來(lái)這里,價(jià)格超實(shí)惠,人也很好! Q:170813916,V信:wx480021,更多優(yōu)惠盡請(qǐng)期待...</p></div><div class="fr">2013-10-10</div><p class="hf"><a href="">回復(fù)</a></p></dd></dl></div></ul></div></div><div class="remai sj-wrapper"><div class="title">本店熱賣(mài)</div><ul><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚潮流小包可以單肩斜挎</a></p><p class="p2"><em class="em1">￥28.00</em></p><p class="p3">4637人已購(gòu)買(mǎi)</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚潮流小包可以單肩斜挎</a></p><p class="p2"><em class="em1">￥28.00</em></p><p class="p3">4637人已購(gòu)買(mǎi)</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚潮流小包可以單肩斜挎</a></p><p class="p2"><em class="em1">￥28.00</em></p><p class="p3">4637人已購(gòu)買(mǎi)</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚潮流小包可以單肩斜挎</a></p><p class="p2"><em class="em1">￥28.00</em></p><p class="p3">4637人已購(gòu)買(mǎi)</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚潮流小包可以單肩斜挎</a></p><p class="p2"><em class="em1">￥28.00</em></p><p class="p3">4637人已購(gòu)買(mǎi)</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚潮流小包可以單肩斜挎</a></p><p class="p2"><em class="em1">￥28.00</em></p><p class="p3">4637人已購(gòu)買(mǎi)</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚潮流小包可以單肩斜挎</a></p><p class="p2"><em class="em1">￥28.00</em></p><p class="p3">4637人已購(gòu)買(mǎi)</p></li><li><a href=""><img src="images/list1.jpg" /></a><p class="p1"><a href="">2014人氣必?cái)⊥?萬(wàn)搭款時(shí)尚潮流小包可以單肩斜挎</a></p><p class="p2"><em class="em1">￥28.00</em></p><p class="p3">4637人已購(gòu)買(mǎi)</p></li></ul></div><div class="sj-center sj-wrapper clearfix"><ul><li><a href=""><img src="images/pc_bao_new.png" /></a><p class="da"><a href="">全場(chǎng)免運(yùn)費(fèi)</a></p><p><a href="">無(wú)最低消費(fèi)限制</a></p></li><li><a href=""><img src="images/pc_seven_new.png" /></a><p class="da"><a href="">七天無(wú)理由退款</a></p><p><a href="">輕松購(gòu)物有保障</a></p></li><li><a href=""><img src="images/pc_pei_new.png" /></a><p class="da"><a href="">退貨補(bǔ)貼運(yùn)費(fèi)</a></p><p><a href="">輕松購(gòu)物有保障</a></p></li><li><a href=""><img src="images/pc_fan_new.png" /></a><p class="da"><a href="">先行賠付</a></p><p><a href="">輕松購(gòu)物有保障</a></p></li></ul> </div></div><footer><div class="foot"><div class="wrapper"><div class="fl left"><p><a href="" class="foot-logo"></a></p><div class="share"><a href="" class="sina"></a><a href="" class="qq"></a><a href="" class="weixin"></a><a href="" class="wap"></a></div><p>增值電信業(yè)務(wù)經(jīng)營(yíng)許可證：浙B2-20110349</p><p>?2013 Mogujie.com,All Rights Reserved.</p></div><div class="center fl"><dl class="xiaofei"><dt>獲取更新</dt><dd><a href="">郵件訂閱</a></dd><dd><a href="">iPhone/Android</a></dd><dd><a href="">美團(tuán)QQ空間</a></dd><dd><a href="">美團(tuán)新浪微博</a></dd><dd><a href="">sitemap</a></dd><dd><a href="">RSS訂閱</a></dd></dl><dl class="gongsi"><dt>公司</dt><dd><a href="">關(guān)于美團(tuán)</a></dd><dd><a href="">美團(tuán)承諾</a></dd><dd><a href="">媒體報(bào)道</a></dd><dd><a href="">加入我們</a></dd><dd><a href="">法律聲明</a></dd><dd><a href="">用戶協(xié)議</a></dd></dl><dl class="shangjia"><dt>商務(wù)合作</dt><dd><a href="">提供團(tuán)購(gòu)信息</a></dd><dd><a href="">美團(tuán)商家營(yíng)銷平臺(tái)</a></dd><dd><a href="">市場(chǎng)合作</a></dd><dd><a href="">美團(tuán)聯(lián)盟</a></dd><dd><a href="">廉正郵箱</a></dd><dd><a href="">moc.nautiem@gnehznail</a></dd></dl><dl class="bangzhu"><dt>用戶幫助</dt><dd><a href="">申請(qǐng)退款</a></dd><dd><a href="">查看美團(tuán)券密碼</a></dd><dd><a href="">常見(jiàn)問(wèn)題</a></dd><dd><a href="">開(kāi)放API</a></dd><dd><a href="">美團(tuán)云</a></dd><dd><a href="">反詐騙公告</a></dd></dl></div><div class="youce fr"><div class="ico"></div><p>退款、退換貨、查看美團(tuán)券<br /><em>參考教程，輕松搞定 ?</em></p><p class="tel">客服電話：400-660-5335<br />服務(wù)時(shí)間：每天 9:00 - 22:00</p></div></div><div class="clearfix"></div></div> </footer> <script src="js/all.js" type="text/javascript"></script> </body> </html>

四、學(xué)習(xí)資料

~ 關(guān)注我，點(diǎn)贊博文~ 每天帶你漲知識(shí)!
相關(guān)問(wèn)題可以相互學(xué)習(xí)，可關(guān)注↓公Z號(hào) 獲取更多源碼 !

web前端零基礎(chǔ)-入門(mén)到高級(jí) (視頻+源碼+開(kāi)發(fā)軟件+學(xué)習(xí)資料+面試題) 一整套 (教程)
適合入門(mén)到高級(jí)的童鞋們?nèi)胧謣送1000套HTML+CSS+JavaScript模板網(wǎng)站

五、更多源碼

HTML5期末考核大作業(yè)源碼* 包含個(gè)人、美食、公司、學(xué)校、旅游、電商、寵物、電器、茶葉、家居、酒店、舞蹈、動(dòng)漫、明星、服裝、體育、化妝品、物流、環(huán)保、書(shū)籍、婚紗、軍事、游戲、節(jié)日、戒煙、電影、攝影、文化、家鄉(xiāng)、鮮花、禮品、汽車、其他可滿足大學(xué)生網(wǎng)頁(yè)大作業(yè)網(wǎng)頁(yè)設(shè)計(jì)需求, 喜歡的可以下載!