基于HTML CSS 网站注册实例

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
	<style type="text/css">
		.logo{
			height: 60px;
			width: 33%;
			float: left;
			line-height: 60px;
		}
		.lianjie{
			color: white;
			text-decoration: none;
		}
		.table{
			width: 60%;
			align: center;
		}
	</style>
</head>
<body>
	<!-- 第一部分 -->
	<div>
		<div>
			<div class="logo">
				<img alt="" src="imgs/logo2.png">
			</div>
			<div class="logo">
				<img alt="" src="imgs/header.png">
			</div>
			<div class="logo" style="text-align: center;">
				<a href="#">登录</a>
				<a href="#">注册</a>
				<a href="#">购物车</a>
			</div>
		</div>
	</div>
	
	<div style="clear: both;"></div>
	<!-- 第二部分 -->
	<div style="height: 40px;width: 100%;background-color: black;line-height: 40px;">
		<a href="#" class="lianjie">首页</a>
		<a href="#" class="lianjie">手机数码</a>
		<a href="#" class="lianjie">鞋靴箱包</a>
		<a href="#" class="lianjie">电脑办公</a>
		<a href="#" class="lianjie">香烟酒水</a>
	</div>
	<!-- 第三部分 -->
	<div style="background: url('imgs/regist_bg.jpg'); height: 500px;width:100%">
		<div style="position:absolute;top:150px;left:350px;border:5px solid black;width: 50%;height: 70%;background-color: white">
			<table class="table" align="center">
				<tr>
					<td colspan="2"><font color="blue" size="6">会员注册</font>USER REGISTER</td>
				</tr>
				<tr>
					<td>用户名:</td>
					<td><input type="text" placeholder="请输入用户名"></td>
				</tr>
				<tr>
					<td>密码:</td>
					<td><input type="password" placeholder="请输入密码"></td>
				</tr>
				<tr>
					<td>确认密码:</td>
					<td><input type="password" placeholder="请再次输入密码"></td>
				</tr>
				<tr>
					<td>email:</td>
					<td><input type="email" placeholder="请输入邮箱"></td>
				</tr>
				<tr>
					<td>姓名:</td>
					<td><input type="text" placeholder="请输入真实姓名"></td>
				</tr>
				<tr>
					<td>性别:</td>
					<td><input type="radio" name="sex">男<input type="radio" name="sex">女</td>
				</tr>
				<tr>
					<td>出生日期:</td>
					<td><input type="datetime"></td>
				</tr>
				<tr>
					<td></td>
					<td><input type="submit" value="注册"></td>
				</tr>
			</table>
		</div>
	</div>
	<!-- 第四部分 -->
	<div>
		<img alt="" src="imgs/footer.jpg" width="100%">
	</div>
	<!-- 第五部分 -->
	<div style="text-align: center;">
		<a href="#" class="abc">关于我们</a>
		<a href="#" class="abc">联系我们</a>
		<a href="#" class="abc">招贤纳士</a>
		<a href="#" class="abc">法律声明</a>
		<a href="#" class="abc">友情链接</a>
		<a href="#" class="abc">支付方式</a>
		<a href="#" class="abc">配送方式</a>
		<a href="#" class="abc">服务声明</a>
		<a href="#" class="abc">广告声明</a>		
		<br>版权所有
	</div>
</body>
</html>


猜你喜欢

转载自blog.csdn.net/weixin_42230478/article/details/81002733