html-注册页面 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>注册</title>
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}

			.wrap {
				width: 400px;
				font-size: 18px;
				margin: 40px auto;
				line-height: 50px;
			}

			.wrap input {
				width: 240px;
				height: 30px;
				font-size: 17px;
				margin-left: 10px;
				padding-left: 5px;
			}
			
			h1{
				font-size: 20px;
			}
			.name span {
				margin-left: 36px;
			}

			.yz {
				position: relative;
			}

			.yz span {
				margin-left: 18px;
			}

			.yz img {
				position: absolute;
				left: 278px;
				top: 12px;
				height: 30px;
			}
			a{
				text-decoration: none;
			}
			.mess{
				position: relative;
			}
			.mess a{
				position: absolute;
				right: 80px;
				/* 用外边距也行
				margin-left: -98px; */
    
				font-size: 12px;
				color: #000000;
			}
			.sub{
				margin-left: 82px;
			}
			.sub input{
				width: 248px;
				height: 40px;
				color: #fff;
				border: none;
				border-radius: 4px;
				background-color: #FF4A00;
			}
			.foot{
				font-size: 13px;
				margin-left: 230px;
				line-height: 30px;
			}
			.foot a{
				color: #FF6804;
				text-decoration: underline;
			}
		</style>
	</head>
	<body>
		<div class="wrap">
			<h1>中公优就业注册</h1>
			<form action="#" method="">
				<div class="name">
					<label>
						<span>手机:</span>
						<input type="text" name="name" id="" value="" placeholder="请输入手机号" />
					</label>
				</div>
				<div>
					<label>
						<span>创建密码:</span>
						<input type="password" name="pwd" id="" value="" placeholder="请输入密码" />
					</label>
				</div>
				<div>
					<label>
						<span>确认密码:</span>
						<input type="password" name="pwd" id="" value="" placeholder="请再次输入密码" />
					</label>
				</div>
				<div class="yz">
					<label>
						<span>验证码:</span>
						<input type="text" name="yz" id="" value="" placeholder="请输入验证码" />
						<img src="./images/yz.jpg">
					</label>
				</div>
				<div class="mess">
					<label>
						<span>短信验证:</span>
						<input type="text" name="yz" id="" value="" placeholder="请输入验证码" />
						<span><a href="javascript:;">免费获取短信</a></span>
					</label>
				</div>
				<div class="sub">
					<input type="submit" name="" id="" value="注册" />
				</div>
				<div class="foot">
					已有账号，请<span><a href="javascript:;">登录</a></span>
				</div>
			</form>
		</div>
	</body>
</html>

 

posted @ 2020-02-14 14:24  JackieDYH  阅读(6)  评论(0)  编辑  收藏  举报  来源