HTML+CSS+JS——仿京东(7页) 大学生简单个人静态HTML网页设计作品 DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载

最新推荐文章于 2024-04-13 16:58:00 发布
最新推荐文章于 2024-04-13 16:58:00 发布
阅读量643 收藏 5
点赞数
分类专栏： 学生div+css静态网页设计成品 HTML5期末大作业 html网页设计作业 文章标签： css html javascript 商城 购物\
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_524614081/article/details/122344989
版权

HTML5期末大作业京东网站设计——仿京东(7页) 大学生简单个人静态HTML网页设计作品 DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载

文章目录

一、作品展示

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

二、文件目录

在这里插入图片描述

三、代码实现


<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>京东(JD.COM)-正品低价、品质保障、配送及时、轻松购物！</title>
		<link rel="stylesheet" href="css/cssreset.css">
		<link rel="stylecut icon" href="favicon.ico">
		<link rel="stylesheet" href="css/index.css">
		<script src="js/jquery-3.0.0.min.js"></script>
	</head>
	<body>
		<div class="fix1">
			<div>
				<h5></h5>
				<div>
					<div class="search"><input type="text" placeholder="监控摄像头"><span></span></div>
						<div class="car">
							我的购物车
							<span></span>
						</div>
				</div>
			</div>
		</div>
		<div class="fix2"></div>
		<div class="fix3">
			<ul>
				<li>京东秒杀</li>
				<li></li>
				<li>特色优选</li>
				<li>频道广场</li>
				<li>为你推荐</li>
				<li><span class="a">客服</span></li>
				<li><span class="b">反馈</span></li>
				<li><span class="c">顶部</span></li>
			</ul>
		</div>
		<div class="fix4"></div>
		<div class="header">
			<div>
				<img src="images/index/46.jpg.webp" alt="" class="img1">
				<img src="images/index/35.png.webp" alt="" class="img2">
				<img src="images/index/34.png.webp" alt=""class="img3">
				<span>×</span>
			</div>
		</div>
		<div class="bg">
			<header>
				<ul class="header-left">
					<li>
						<div></div>
						<!-- <span class="house"></span>
						<a href="#">京东首页</a> -->
					</li>
					<li class="db">					
						<div>					
						<dl class="up">
							<dd>北京</dd>
							<dd>上海</dd>
							<dd>天津</dd>
							<dd>重庆</dd>
							<dd>河北</dd>
							<dd>山西</dd>
							<dd>河南</dd>
							<dd>辽宁</dd>
							<dd>吉林</dd>
							<dd>黑龙江</dd>
							<dd>内蒙古</dd>
							<dd>江苏</dd>
							<dd>山东</dd>
							<dd>安徽</dd>
							<dd>浙江</dd>
							<dd>福建</dd>
							<dd>湖北</dd>
							<dd>湖南</dd>
							<dd>广东</dd>
							<dd>广西</dd>
							<dd>江西</dd>
							<dd>四川</dd>
							<dd>海南</dd>
							<dd>贵州</dd>
							<dd>云南</dd>
							<dd>西藏</dd>
							<dd>陕西</dd>
							<dd>甘肃</dd>
							<dd>青海</dd>
							<dd>宁夏</dd>
							<dd>新疆</dd>
							<dd>港澳</dd>
							<dd>台湾</dd>
							<dd>钓鱼岛</dd>
							<dd>海外</dd>				
						</dl>
						<dl class="down">
							<dt><a href="#">Available Sites</a></dt>
							<dd><a href="#">Global Site</a></dd>
							<dd><a href="#">Сайт России</a></dd>
							<dd><a href="#">Situs Indonesia</a></dd>
							<dd><a href="#">Sitio de España</a></dd>
							<dd><a href="#">เว็บไซต์ประเทศไทย</a></dd>
						</dl>
						</div>
						<span class="gps"></span>
						<span class="place">广东</span>
					</li>
				</ul>
				<ul class="header-right">
					<li class="user">					
						<div>
							<div class="out">
								<img src="images/no-img_mid_.jpg" alt="">
								<span class="vplus"></span>
								<span>开通PLUS 平均省1012元/年></span>
							</div>
							<div class="choose">
								<ul>
									<li class="left"><</li>
									<li class="mid">
										<ol>
											<li>
												<span></span>
												<p>免费试用</p>
											</li>
											<li>
												<span></span>
												<p>运费免单</p>
											</li>
											<li>
												<span></span>
												<p>生日特权</p>
											</li>
											<li>
												<span></span>
												<p>闪电退款</p>
											</li>
											<li>
												<span></span>
												<p>上门换新</p>
											</li>
											<li>
												<span></span>
												<p>京享值礼包</p>
											</li>
											<li>
												<span></span>
												<p>贵宾专线</p>
											</li>
											<li>
												<span></span>
												<p>运费双免</p>
											</li>		
										</ol>
									</li>
									<li class="right">></li>
								</ul>
							</div>
						</div>
						<a href="#">代码小白</a>
						<span class="plus"></span>
						<span class="tip"></span>
					</li>
					<li>
						<div></div>
						<a href="html/myorder.html">我的订单</a>
					</li>
					<li class="myjd arrow">					
						<div>
							<dl>
								<dd><a href="#">待处理订单</a></dd>
								<dd><a href="#">返修退换货</a></dd>
								<dd><a href="#">降价商品</a></dd>
							</dl>
							<dl>
								<dd><a href="#">消息</a></dd>
								<dd><a href="#">我的问答</a></dd>
								<dd><a href="#">我的关注</a></dd>
							</dl> 
							
							<dl>
								<dd><a href="#">我的京豆</a></dd>
								<dd><a href="#">我的白条</a></dd>
							</dl>
							<dl>
								<dd><a href="#">我的优惠券</a></dd>
								<dd
最低0.47元/天 解锁文章
优质内容贡献
关注
  • 0
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
HTML+CSS+JavaScript仿京东购物商城网站 web前端制作服装购物商城 html电商购物网站
VX_WJ88950106的博客
08-06 2万+
⚽精彩专栏推荐👇🏻👇🏻👇🏻 ❤ 【作者主页——🔥获取更多优质源码】 ❤ 【web前端期末大作业——🔥🔥毕设项目精品实战案例(1000套)】1 网页简介：此作品为学生个人主页网页设计题材，HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码，这是一个不错的网页制作，画面精明，代码为简单学生水平, 非常适合初学者学习使用。2.网页编辑：网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Web......
HTML+CSS+JS 网页设计模板.zip
05-31
HTML+CSS+JS 网页设计模板.zip
【购物电商 个人网页制作 假期作业 大学生个人网页设计 个人网站模板 Html+css+js/Jquery作品】
weixin_55415300的博客
06-09 321
小编专门为你打造设计网页//期末作业 Html+css+js 想要源码的抓紧联系小编
html+css+js——仿京东页面
snjxh的博客
06-20 818
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>18 不负每一分热爱</title> </head> <body> <style> *{ margin: 0; padding: 0; } .d1{ width: 100%;
HTML期末大作业 ~ 凤阳智慧旅游官方旗舰店(我的家乡)网页设计作业成品(HTML+CSS+JavaScript)
七夕情人节表白网页代码100款 HTML5网页设计与制作1120款 Echarts大屏数据150款
06-30 6962
HTML期末大作业 ~ (我的家乡)大学生旅游网页设计作业成品 ~ HTML+CSS+JS网页设计期末课程大作业 ~ web前端开发技术 ~ web课程设计网页规划与设计 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求~ 原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，~这是一个不错的网页制作，画面精明，非常适合初学者学习使用。 作品介
大学生简单个人静态HTML网页设计作品 DIV布局个人介绍网页模板代码 DW学生个人网站制作成品下载
08-10
HTML静态网页设计作业，采用DIV+CSS布局，共有多个页面，使用CSS排版比较丰富，色彩鲜明有活力,顶部导航及底部 区域背景色为100%宽度。都是给学生定制的都符合学生考试期末作业的水平,有的有js，有的视频+音乐+...
简单家乡风景静态HTML网页设计作品 DIV布局家乡介绍网页模板代码 DW个人网站制作成品 web网页制作与实现
08-10
HTML静态网页设计作业，采用DIV+CSS布局，共有多个页面，使用CSS排版比较丰富，色彩鲜明有活力,顶部导航及底部 区域背景色为100%宽度。都是给学生定制的都符合学生考试期末作业的水平,有的有js，有的视频+音乐+...
简单个人网页设计作业 静态HTML个人博客主页——HTML+CSS+JavaScript 明星鹿晗(7页)
08-10
HTML静态网页设计作业，采用DIV+CSS布局，共有多个页面，使用CSS排版比较丰富，色彩鲜明有活力,顶部导航及底部 区域背景色为100%宽度。都是给学生定制的都符合学生考试期末作业的水平,有的有js，有的视频+音乐+...
简单个人静态HTML网页设计作品 DIV布局个人介绍网页模板代码 DW个人网站制作成品 web网页制作与实现
08-10
HTML静态网页设计作业，采用DIV+CSS布局，共有多个页面，使用CSS排版比较丰富，色彩鲜明有活力,顶部导航及底部 区域背景色为100%宽度。都是给学生定制的都符合学生考试期末作业的水平,有的有js，有的视频+音乐+...
大学生简单抗击疫情静态HTML网页设计作品 DIV布局疫情感动人物介绍网页模板代码 DW学生抗疫逆行者网站制作成品下载
08-10
HTML静态网页设计作业，采用DIV+CSS布局，共有多个页面，使用CSS排版比较丰富，色彩鲜明有活力,顶部导航及底部 区域背景色为100%宽度。都是给学生定制的都符合学生考试期末作业的水平,有的有js，有的视频+音乐+...
大学生网页设计制作作业实例代码 (全网最全,建议收藏) HTML+CSS+JS
热门推荐
有问必答，欢迎打扰，项目开发，网页设计
10-31 3万+
临近期末，大一新生的各种考试和专业结课作业纷至沓来。web实训大作业、网页期末作业、web课程与设计、网页设计等，简直让人头大。你还在为网页设计老师的作业要求感到头大？网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求, 废话不多说，直接看效果。📔网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。📓网站程序方面：计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确
html+css实现京东、英雄联盟静态页面
Wksycxy的博客
05-21 4278
真高仿，像真的一样，京东页面的效果几乎都做出来了。
京东右边固定导航
ly_zioyne的博客
12-10 3524
代码：         charset="utf-8">   type="text/css">   body{font-size: 12px;}   body,menu,ul,li,span{   margin:0px;padding: 0px;    
HTML5_京东首页样式
itszt888的博客
08-02 4621
通用样式：去掉边框，里面的东西不会乱 页头： /*头部样式*/ #header{ background:#f7f7f7; } #header>.header_inner{ height:32px; } #header>.header_inner>.lf{ line-height:32px; } #header>.header_inner>.lf>img{
HTML和CSS实现京东首页
dwjdj的博客
12-26 3万+
HTML代码 基本结构 需要练手，或者需要代码的留言即可 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>京东(JD.COM)-正品低价、品质保障、配送及时、轻松购物！</title> <meta nam...
用html和CSS简单实现京东侧边栏
m0_56713342的博客
10-07 208
【代码】用html和CSS简单实现京东侧边栏。
【京东电商网站主界面仿写——HTML第二部分】
最新发布
2301_79849953的博客
04-13 757
面试题千万不要死记，一定要自己理解，用自己的方式表达出来，在这里预祝各位成功拿下自己心仪的offer。需要完整面试题的朋友可以点击蓝色字体获取分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！**如果你觉得这些内容对你有帮助，可以扫码获取！！（备注：前端）面试题千万不要死记，一定要自己理解，用自己的方式表达出来，在这里预祝各位成功拿下自己心仪的offer。需要完整面试题的朋友可以点击蓝色字体获取。
【Web前端】京东商城项目实战HTML+CSS+JavaScript
不会敲代码的程序员
09-17 5585
1、项目结构 2、源码下载 3、页面展示 3.1、京东商城首页（index.html） 3.1.1、首页--轮播图 3.1.2、首页--商品分类 3.1.3、首页--生活的橱窗 3.1.4、首页--家电通讯 3.1.5、首页--电脑数码 3.1.6、首页--服饰鞋包 3.1.7、首页--美容珠宝 3.1.8、首页--家具生活 3.1.9、 首页--母音玩具 3.1.10、首页--食品保健 3.1.11、首页--图书音像 3.1.12、首页--foot 3.1.13、首页--html源码（不含js、css）
html邮箱代码怎么写_如何制作一个简单的HTML登录页面（附代码）
weixin_39895684的博客
11-02 4870
几乎每个网站都会有登录页面，那你知道如何写HTML登录页面吗？这篇文章就和大家分享一个HTML简单登录界面的代码，有一定的参考价值，感兴趣的朋友可以看看。实例：制作一个HTML登录页面，包含邮箱，登录密码，立即注册，忘记密码等，代码如下：HTML部分：程序猿的生活：打造全网web前端全栈资料库（总目录）看完学的更快，掌握的更加牢固，你值得拥有（持续更新）​zhuanlan.zhihu.com&lt...
html5期末大作业:商城网页设计——仿京东商城网页端模板(8页面) html+css+javascr
11-17
在整个设计过程中，我努力保持页面的整体风格和布局与京东商城网页端模板一致，同时也增加了一些自己的创意和改进，使得整个网页更加适合现代用户的需求和使用习惯。 总的来说，通过这个大作业的设计，我对HTML5、...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值