HTML5响应式手机模板：【超炫购物模板】——仿拍鞋网商城手机网站模板( HTML+CSS+JavaScript) 企业手机网站模板
HTML5响应式手机模板：电商网站设计——仿拍鞋网商城手机网站模板( HTML+CSS+JavaScript) 企业手机网站模板
手机网站模板 电商网站手机模板 响应式手机网站 html5手机网站模板 企业手机网站模板 公司手机网站模板
作品介绍
1.网页作品简介方面 ：原始HTML+CSS+JS页面设计,HTML5响应式手机模板，这是一个不错的网页制作，画面精明，非常适合初学者学习使用。
2.网页作品编辑方面：此作品为html5响应式手机模板， html+css 布局制作，作品下载后可使用任意HTML编辑软件（例如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm 所有编辑器均可使用）
文章目录
- HTML5响应式手机模板：电商网站设计——仿拍鞋网商城手机网站模板( HTML+CSS+JavaScript) 企业手机网站模板
- 作品介绍
- 一、作品演示
- 二、代码目录
- 三、代码实现
- 四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)
- 五、源码获取
- 六、更多HTML期末大作业(成品下载)
- >>>戳我>>>点击进入200例期末大作业作品
一、作品演示
二、代码目录
三、代码实现
doctype html>
<html><head><title>仿拍鞋网商城首页触屏版html5手机wap购物网站title><meta charset="utf-8"><meta name="keywords" content="拍鞋网,拍鞋网官方网站,拍鞋网商城" /><meta name="description" content="买鞋子哪个网站好，当然首选拍鞋网!中国最早成立的正品鞋子购物网站,国内最大的品牌鞋子销售广场。所售鞋子100%厂家授权,全国包邮,货到付款,提供最完美的购物体验！" /><link rel="icon" href="favicon.ico" type="image/x-icon" /><link rel="bookmark" href="favicon.ico" type="image/x-icon" /><link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /><meta content="width=device-width, minimum-scale=1,initial-scale=1, maximum-scale=1, user-scalable=1;" id="viewport" name="viewport" /><meta content="yes" name="apple-mobile-web-app-capable" /><meta content="black" name="apple-mobile-web-app-status-bar-style" /><meta content="telephone=no" name="format-detection" /><iframe src="http://app.uc.cn/appstore/AppCenter/frame@uc_param_str=nieidnutssvebipfcp&api_ver=2.0&id=1904" width="100%" height="160" style="display:none" id="otherPage">iframe><div class="com-content"><script>function open_notice(id){setCookie('touch_notice_close',1);var url = 'new/info/'+id+'.html';window.location.href=url;} var touch_notice_close = getCookie('touch_notice_close');if(touch_notice_close == '1' && typeof(document.getElementById('js-com-notification2')) != 'undefined' && document.getElementById('js-com-notification2') != null){document.getElementById('js-com-notification2').style.display = 'none';}//if( document.cookie.match(new RegExp("(^| )PHPSESSID=([^;]*)(;|$)")) ){// document.getElementById('js-com-notification').style.display = 'none';// }script><div class="com-header-area" id="js-com-header-area"><a href="default.htm" class="com-header-logo">a><dfn>dfn><p><a class="com-header-search" id="js-com-header-search"><del>del>a><a href="login/default.htm" class="com-header-user "><del>del>a><i>i><a href="cart/default.htm" class="com-header-cart "><b id="header-cart-num">0b><del>del>a>p><div class="clear">div><form action="/s.php" method="post"><strong><input type="text" name="keyword" id="js-com-search-text" value=""/><input type="submit" value=" "/>strong><div id="js-com-search-recommend"><div>div><a href="p-_m0003s0017_1.html@asc=id" style="color:#000000 ">女单鞋a><a href="p-m0001_id;1.html" style="color:#ed1749">运动新品a><a href="p-m0001s0014_1.html" style="color:#000000">篮球鞋a>div>form>div><div class="com-content-area" id="js-com-content-area"><script type="text/javascript">$(function(){$('.pxui-show-more').first().find('a').click(); $('.pxui-show-more').last().find('a').click(); });
script>
<div class="page-role home-page"><link type="text/css" rel="stylesheet" href="template/css/home/index.css"/><script src="template/js/com/jquery.touchslider.min.js">script><script src="template/js/home/index.js">script>
<script>
jQuery(function($) {$(window).resize(function(){var width=$('#js-com-header-area').width();$('.touchslider-item a').css('width',width);$('.touchslider-viewport').css('height',300*(width/640));}).resize(); $(".touchslider").touchSlider({mouseTouch: true, autoplay: true});
});
script> <div class="touchslider"><div class="touchslider-viewport"><div class="touchslider-item"><a href="topic/739.html"><img src="http://img-cdn2.paixie.net/newspic/20140408/1396940354243f5b.jpg" style="vertical-align:top;"/>a>div><div class="touchslider-item"><a href="topic/730.html"><img src="http://img-cdn2.paixie.net/newspic/20140328/1395970986accb4f.jpg" style="vertical-align:top;"/>a>div><div class="touchslider-item"><a href="topic/725.html"><img src="http://img-cdn2.paixie.net/newspic/20140331/1396235117d367d2.jpg" style="vertical-align:top;"/>a>div><div class="touchslider-item"><a href="topic/733.html"><img src="http://img-cdn2.paixie.net/newspic/20140401/13963430797a3567.jpg" style="vertical-align:top;"/>a>div><div class="touchslider-item"><a href="topic/731.html"><img src="http://img-cdn2.paixie.net/newspic/20140404/139657373135668e.jpg" style="vertical-align:top;"/>a>div><div class="touchslider-item"><a href="topic/732.html"><img src="http://img-cdn2.paixie.net/newspic/20140331/13962355233033ac.jpg" style="vertical-align:top;"/>a>div>div><div class="touchslider-navtag"><span class="touchslider-nav-item touchslider-nav-item-current">span><span class="touchslider-nav-item ">span><span class="touchslider-nav-item ">span><span class="touchslider-nav-item ">span><span class="touchslider-nav-item ">span><span class="touchslider-nav-item ">span>div>
div><div class="pxui-tab pxui-tab-nav pxui-tab-no-top"><a class="selected"><i>i>首页<span>span>a><a href="category/default.htm"><i>i>分类<span>span>a><a href="brand/default.htm"><i>i>品牌<span>span>a><a href="tuan/default.htm"><i>i>团购<span>span>a><a href="login/@url=_2Fmember_2Forder@pay=2"><i>i>查看物流<span>span>a>div><div class="tags"><table border="0" cellspacing="5" cellpadding="0"><tr><td colspan="2"><a href="help/app.html"><i>i>拍鞋网APP<br/>总能找到你的至爱a>td><td><a href="topic/612.html"><i>i>3折封顶a>td><td rowspan="2"><a href="topic/612.html"><i>i>限<br/>时<br/>促<br/>销a>td>tr><tr><td><a href="topic/612.html"><b>最新b><br/>上架a>td><td colspan="2"><a href="help/weixin.html">拍鞋网微信<br/>你的随身好帮手<i>i>a>td>tr>table>div><div class="pxui-area styles"><h2 style="background-color: #ffaf51 ; " ><a href="p-_m0001s0001_.html" style="color:#FFFFFF;" >运动馆a>h2><a class="max" href="p-anta__1.html@page=5"><img src="http://img-cdn2.paixie.net/newspic/20140408/1396917342e17426.jpg" width="120" height="140"/>a><div><p><a href="nike/default.htm" style="margin-right:3px;background-color: #ffaf51; color:#FFFFFF;border: 1px solid #ffaf51; " >耐克a><a href="adidas/default.htm" style="margin-right:3px; " >阿迪达斯a><a href="anta/default.htm" style="margin-right:3px; " >安踏a><a href="erke/default.htm" style="margin-right:3px;background-color: #ffaf51; color:#FFFFFF;border: 1px solid #ffaf51; " >鸿星尔克a><a href="p-m0001s0029_1.html" style="margin-right:3px; " >网球鞋a><a href="forbid/p-__25E7_25AF_25AE_25E7_2590_2583_25E9_259E_258B__1.html" style="margin-right:3px;background-color: #ffaf51; color:#FFFFFF;border: 1px solid #ffaf51; " >篮球鞋a><a href="p-_m0001s0064_.html" style="margin-right:3px; " >帆布鞋a><a href="p-_m0001s0001_.html" class="more" >更多<del><i class="arrow-right">i>del>a> p>div>div><div class="pxui-area styles"><div><p><a href="moolecole/default.htm" style="margin-left:3px;margin-right:0px; " >莫蕾蔻蕾a><a href="mingdian/default.htm" style="margin-left:3px;margin-right:0px;background-color: #ff8080; color:#FFFFFF;border: 1px solid #ff8080; " >名典a><a href="p-daphne__1.html@special=1&asc=id" style="margin-left:3px;margin-right:0px;background-color: #ff8080; color:#FFFFFF;border: 1px solid #ff8080; " >达芙妮新品开抢a><a href="forbid/p-__25E5_258D_2595_25E9_259E_258B__1.html" style="margin-left:3px;margin-right:0px; " >单鞋a><a href="forbid/p-__25E9_25AB_2598_25E8_25B7_259F_25E9_259E_258B__1.html" style="margin-left:3px;margin-right:0px; " >高跟鞋a><a href="p-m0003s0080_1.html" style="margin-left:3px;margin-right:0px; " >平底鞋a><a href="p-_m0003s0003_.html" class="more" >更多<del><i class="arrow-right">i>del>a> p>div><a class="max" href="moolecole/@page=5"><img src="http://img-cdn2.paixie.net/newspic/20140408/13969173357d0aa6.jpg" width="120" height="140"/>a><h2 style="background-color: #ff8080" ><a href="p-_m0003s0003_.html" style="color:#FFFFFF;" >女鞋馆a>h2>div><div class="pxui-area styles"><h2 style="background-color: #688fd0 ; " ><a href="p-_m0002s0002_.html" style="color:#FFFFFF;" >男鞋馆a>h2><a class="max" href="playboy/default.htm"><img src="http://img-cdn2.paixie.net/newspic/20140408/13969173291cedd8.jpg" width="120" height="140"/>a><div><p><a href="longpai/default.htm" style="margin-right:3px; " >龙派a><a href="playboy/default.htm" style="margin-right:3px;background-color: #688fd0; color:#FFFFFF;border: 1px solid #688fd0; " >花花公子a><a href="fgn/default.htm" style="margin-right:3px;background-color: #688fd0; color:#FFFFFF;border: 1px solid #688fd0; " >富贵鸟a><a href="yearcon/default.htm" style="margin-right:3px; " >意尔康a><a href="p-m0002s0119_id;1.html" style="margin-right:3px; " >潮男鞋a><a href="p-m0002s0159_1.html" style="margin-right:3px; " >商务鞋a><a href="forbid/p-__m000206068_1.html" style="margin-right:3px;background-color: #688fd0; color:#FFFFFF;border: 1px solid #688fd0; " >清仓a><a href="p-_m0002s0002_.html" class="more" >更多<del><i class="arrow-right">i>del>a> p>div>div><div class="pxui-area styles"><div><p><a href="forbid/p-__25E6_25B5_25B7_25E6_25B3_25B0_25E5_25AE_25A2__1.html" style="margin-left:3px;margin-right:0px; " >海泰客a><a href="forbid/p-__25E5_25A7_258B_25E7_25A5_2596_25E9_25B8_259F__1.html" style="margin-left:3px;margin-right:0px;background-color: #c49741; color:#FFFFFF;border: 1px solid #c49741; " >始祖鸟a><a href="baopiao/default.htm" style="margin-left:3px;margin-right:0px;background-color: #c49741; color:#FFFFFF;border: 1px solid #c49741; " >宝飘a><a href="addnice/default.htm" style="margin-left:3px;margin-right:0px; " >艾迪耐斯a><a href="p-m0290s0319_1.html" style="margin-left:3px;margin-right:0px;background-color: #c49741; color:#FFFFFF;border: 1px solid #c49741; " >户外套装a><a href="forbid/p-__25E8_2583_258C_25E5_258C_2585__1.html" style="margin-left:3px;margin-right:0px; " >背包a><a href="p-m0006s0046_1.html" style="margin-left:3px;margin-right:0px; " >户外鞋a><a href="p-_m0006s0006_.html" class="more" >更多<del><i class="arrow-right">i>del>a> p>div><a class="max" href="baopiao/default.htm"><img src="http://img-cdn2.paixie.net/newspic/20140408/1396917323bc9d22.jpg" width="120" height="140"/>a><h2 style="background-color: #c49741" ><a href="p-_m0006s0006_.html" style="color:#FFFFFF;" >户外馆a>h2>div><div class="pxui-area styles"><h2 style="background-color: #875e78 ; " ><a href="p-m0178_1.html" style="color:#FFFFFF;" >服装馆a>h2><a class="max" href="guuka/@page=3"><img src="http://img-cdn2.paixie.net/newspic/20140408/139691731865fe66.jpg" width="120" height="140"/>a><div><p><a href="genanx/default.htm" style="margin-right:3px;background-color: #875e78; color:#FFFFFF;border: 1px solid #875e78; " >格男仕a><a href="qianzhihe/default.htm" style="margin-right:3px; " >千纸鹤a><a href="cadeau/default.htm" style="margin-right:3px; " >卡迪奥a><a href="bindwood/default.htm" style="margin-right:3px;background-color: #875e78; color:#FFFFFF;border: 1px solid #875e78; " >彬伊奴a><a href="p-m0265s0267_1.html" style="margin-right:3px; " >男衬衫a><a href="forbid/p-__25E5_25A5_25B3_25E8_25A3_2585__1.html@asc=id" style="margin-right:3px; " >女装a><a href="p-m0178_,s;1.html" style="margin-right:3px; " >特价a><a href="p-m0178_1.html" class="more" >更多<del><i class="arrow-right">i>del>a> p>div>div><div class="pxui-area styles"><div><p><a href="harrypotter/default.htm" style="margin-left:3px;margin-right:0px; " >哈利波特a><a href="kading/default.htm" style="margin-left:3px;margin-right:0px;background-color: #94d15e; color:#FFFFFF;border: 1px solid #94d15e; " >卡丁a><a href="snoopy/default.htm" style="margin-left:3px;margin-right:0px; " >史努比a><a href="bluepeelrise/default.htm" style="margin-left:3px;margin-right:0px;background-color: #94d15e; color:#FFFFFF;border: 1px solid #94d15e; " >蓝贝璐a><a href="forbid/p-__25E7_25AB_25A5_25E8_25A3_2585__1.html" style="margin-left:3px;margin-right:0px; " >儿童装a><a href="forbid/p-__25E7_25AB_25A5_25E9_259E_258B__1.html" style="margin-left:3px;margin-right:0px; " >童鞋a><a href="forbid/p-__m000400656_1.html" style="margin-left:3px;margin-right:0px; " >魔术贴a><a href="p-_m0004s0004_.html" class="more" >更多<del><i class="arrow-right">i>del>a> p>div><a class="max" href="snaughty/@page=10"><img src="http://img-cdn2.paixie.net/newspic/20140408/1396917310ebe74c.jpg" width="120" height="140"/>a><h2 style="background-color: #94d15e" ><a href="p-_m0004s0004_.html" style="color:#FFFFFF;" >儿童馆a>h2>div><div class="pxui-area"><h3><b>Hotb> 爆款推荐h3><div class="pxui-tab pxui-tab-style pxui-tab-no-top" id="js-tab-style"><a class="selected">运动鞋a><a>女鞋a><a>户外鞋a><a>童鞋a><a>服装a>div><div class="pxui-shoes" id="js-home-tab-0"><div>div>div><div class="pxui-show-more" lastid="1" template="#js-bk-template" srcProperty="goodsrc" container="#js-home-tab-0 > div" url="/home/ajax?act=bk_more"><img src="template/images/public/loading.gif" width="24" height="24"/><a>显示更多 <i class="arrow2-bottom">i>a>div><div class="pxui-shoes" id="js-home-tab-1" style="display:none;"><div>div>div><div class="pxui-show-more" style="display:none;" lastid="1" template="#js-bk-template" srcProperty="goodsrc" container="#js-home-tab-1 > div" url="/home/ajax?act=bk_more&sid=94"><img src="template/images/public/loading.gif" width="24" height="24"/><a>显示更多 <i class="arrow2-bottom">i>a>div><div class="pxui-shoes" id="js-home-tab-2" style="display:none;"><div>div>div><div class="pxui-show-more" style="display:none;" lastid="1" template="#js-bk-template" srcProperty="goodsrc" container="#js-home-tab-2 > div" url="/home/ajax?act=bk_more&sid=95"><img src="template/images/public/loading.gif" width="24" height="24"/><a>显示更多 <i class="arrow2-bottom">i>a>div><div class="pxui-shoes" id="js-home-tab-3" style="display:none;"><div>div>div><div class="pxui-show-more" style="display:none;" lastid="1" template="#js-bk-template" srcProperty="goodsrc" container="#js-home-tab-3 > div" url="/home/ajax?act=bk_more&sid=96"><img src="template/images/public/loading.gif" width="24" height="24"/><a>显示更多 <i class="arrow2-bottom">i>a>div><div class="pxui-shoes" id="js-home-tab-4" style="display:none;"><div>div>div><div class="pxui-show-more" style="display:none;" lastid="1" template="#js-bk-template" srcProperty="goodsrc" container="#js-home-tab-4 > div" url="/home/ajax?act=bk_more&sid=97"><img src="template/images/public/loading.gif" width="24" height="24"/><a>显示更多 <i class="arrow2-bottom">i>a>div>div><div class="pxui-area"><h3><b>Top5b> 热销推荐<a class="pxui-button" href="topic/594.html"><span>+span> 更多 >>a>h3><div class="pxui-shoes"><div><a href="shoe-361sport-7212220-500798.html"><div class="img160"><dfn>dfn><img src="http://img-cdn2.paixie.net/images/empty.gif" truesrc="http://img12.paixie.net/361sport/201209/05/paixienet-461516-20120905-080851-p_thumb_160160.jpg"/>div><span class="name">361度 男跑步鞋 蓝/浅灰 7212220span><span class="price">￥159.00span><del class="price">￥339.00del><span class="tag">1span>a><a href="shoe-anta-91315588-1-541341.html"><div class="img160"><dfn>dfn><img src="http://img-cdn2.paixie.net/images/empty.gif" truesrc="http://img9.paixie.net/anta/201305/22/c5d2e5dd32_thumb_160160.jpg"/>div><span class="name">安踏 男跑步鞋 安踏白/钢灰/钻石蓝/黑 91315588-1span><span class="price">￥169.00span><del class="price">￥259.00del><span class="tag">2span>a>div>div><div class="pxui-list"><a href="shoe-josiny-141114130-590823.html"><span class="pxui-bg-blue pxui-color-white">3span><p>卓诗尼 休闲色拼接粗跟圆头通勤 女单鞋 绿色 141114130p><b>￥179.00b>a><a href="shoe-361sport-7214418-503835.html"><span class="pxui-bg-blue pxui-color-white">4span><p>361度 男跑步鞋 黑/浅黄 7214418p><b>￥99.00b>a><a href="shoe-adidas-G97666-548556.html"><span class="pxui-bg-blue pxui-color-white">5span><p>阿迪达斯 Crazy cool m 男跑步鞋 完美蓝/夜色蓝 G97666p>