京东登录页

程序代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>
			*{
				margin: 0px;
				padding: 0px;
			}
			#_head{
				margin: 0px 0px 0px 100px;
				height: 60px;
			}
			#_head img{
				float:left;
			}
			#_head h1{
				margin: 40px 0 0 10px;
				height: 20px;
				font: 20px "微软雅黑" ;
				float:left;
			}
			#_body{
				margin: 40px 5px 20px ;
				padding: 80px ;
				background-image: url(img/banner.png) ;
				background-repeat: no-repeat;
				overflow: hidden;
			}
			#body_reg{
				height: 250px;
				width: 300px;
				background-color: white;
				margin: 0px 500px;
				overflow: hidden;
			}
			#body_reg h1{
				margin: 10px 0 0 20px;
				height: 18px;
				font: 18px "微软雅黑" ;
				float:left;
			}
			#zhuce{
				margin: 13px 20px 0 20px;
				padding: 0px 0 0 20px ;
				height: 20px;
				color: #e4393b;
				font: 15px "微软雅黑" ;
				text-decoration: none;
				background: url(img/icon5.jpg) 0px 3px no-repeat;
				float: right;
			}
			#_form{
				padding: 0px 20px ;
				width: 300px;
				margin: 50px 0px 0 0px;
				overflow: hidden;
			}
			._from{
				height: 40px;
				margin-bottom:20px;
				overflow: hidden;
			}
			#username{
				background: url(img/icon1.jpg); 
				display: inline-block; 
				width: 38px; 
				height: 38px; 
				border: 1px solid  darkgray;  
				border-right: none;
				float: left;
			}
			#name{
				height: 38px;
				width: 220px;
				padding: 0px;
				border-right: none; 
				border: 1px solid gray;
				float: left;
			}
			#userpws{
				background: url(img/icon2.jpg); 
				display: inline-block; 
				width: 38px; 
				height: 38px; 
				border: 1px solid  darkgray;  
				border-right: none;
				float: left;
			}
			#pws{
				height: 38px;
				width: 220px;
				padding: 0px;
				border-right: none; 
				border: 1px solid gray;
				float: left;
			}
			#auto{
				font-size: 0px;
				height: 25px;
				vertical-align:middle; 
				float: left;
			}
			#into label{
				font-size:12px;
				vertical-align:middle;
			}
			#into a{
				margin: 0px 40px 0px 0px;
				height: 20px;
				color: #000000;
				font: 15px "微软雅黑" ;
				text-decoration: none;
				float: right;
			}
			#put{
				margin: 15px -10px;
				border: none;
				background-color: #E4393B;
				color: white;
				font: 15px "微软雅黑" ;
				height: 30px;
				width: 260px;
			}
			#link{
				margin: 20px 80px;
				color: #827981;
			}
			#link a{
				font-size: 10px  ;
				margin: 0px 10px;
				color: #827981;
				text-decoration: none;
			}
			#copy{
				font-size: 10px  ;
				margin: 20px 390px;
				color: #827981;
			}
		</style>
	</head>
	<body>
		<div id="_body_">
			<div id="_head">
				<img src="img/jingdo_logo.png" />
				<h1>欢迎登录</h1>
			</div>
			<div id="_body">
				<div id="body_reg">
					<h1>京东会员</h1>
					<a href="#" id="zhuce">立即注册</a>
					<div id="_form">
						<form action="#" method="post" >
							<div class="_from">
								<span id="username" ></span>
								<input type="text" id="name" name="name" placeholder="邮箱/用户名/已验证手机"/>
							</div>
							<div  class="_from">
								<span id="userpws"></span>
								<input type="password" id="pws" name="psw"/>
							</div>
						    <div id="into">
								<input type="checkbox" name="auto" id="auto"/>
								<label for="auto">自动登录</label>
								<a href="#">忘记密码?</a>
							</div>
							<input type="submit" id="put" value="提交">
						</form>
					</div>
				</div>
			</div>
			<div id="link">
			    <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>|
			    <a href="#">京东公益</a>|
			    <a href="#">English Site</a>
			</div>
			<div id="copy">Copyright©2004-2017 京东JD.com 版权所有</div>
		</div>
	</body>
</html>

完成效果

在这里插入图片描述

# html # css
Logo
快递鸟一站式物流API解决方案

电商企业物流数字化转型必备！快递鸟 API 接口，72 小时快速完成物流系统集成。全流程实战1V1指导，营造开放的API技术生态圈。

更多推荐

苹方字体跨平台解决方案：告别Windows与Mac的字体显示鸿沟

在Web开发中，我们经常面临一个令人头疼的问题：精心设计的页面在Mac上优雅精致，到了Windows设备上却因字体差异而显得平庸。今天，我们为您介绍一个专业的解决方案——PingFangSC字体包，它让苹方字体的优雅设计能够在所有平台上完美呈现。这个开源项目提供了完整的6种字重，支持ttf和woff2双格式，真正实现了跨平台字体统一。## 为什么跨平台字体一致性如此重要？🔍现代Web应用

avatar 快递鸟社区

Ascend-SACT/Mineru-Optimization后端引擎对比：Pipeline、Hybrid与VLM模式如何选择？

Ascend-SACT/Mineru-Optimization提供三种强大的后端引擎模式——Pipeline、Hybrid和VLM，帮助用户高效处理各类文档。本文将深入对比这三种模式的核心特性、性能表现和适用场景，助你快速找到最适合的解决方案。## 三大引擎模式核心特性解析 🚀### Pipeline模式：传统OCR流程的极致优化**核心架构**：采用模块化设计，包含版面分析、OCR、

avatar 快递鸟社区

如何永久保存微信聊天记录？WeChatMsg免费开源工具终极指南

你是否曾担心更换手机后，那些珍贵的微信对话会永远消失？与家人的温馨聊天、重要的工作沟通、朋友间的难忘回忆，这些数字记忆都值得被永久珍藏。**WeChatMsg**是一款完全免费的开源工具，专门用于**微信聊天记录永久保存和深度分析**，让你的每一段对话都能成为永恒的数字资产。## 🔍 你的聊天记录正在面临什么风险？微信已经成为我们日常生活中不可或缺的沟通工具，但官方并未提供完整的聊天记录

avatar 快递鸟社区