注册页面（HTML+css）

注册页面

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>注册页面</title><style>*{margin: 0px;padding: 0px;box-sizing: border-box;}body{background: url("images/register_bg.png") no-repeat center;padding-top: 25px;}.rg_layout{width: 900px;height: 500px;border: 8px solid #EEEEEE;background-color: white;/*让div水平居中*/margin: auto;}.rg_left{/*border: 1px solid red;*/float: left;margin: 15px;}.rg_left > p:first-child{color:#FFD026;font-size: 20px;}.rg_left > p:last-child{color:#A6A6A6;font-size: 20px;}.rg_center{float: left;}.rg_right{float: right;margin: 15px;}.rg_right > p:first-child{font-size: 15px;}.rg_right p a {color:pink;}.td_left{width: 100px;text-align: right;height: 45px;color: #A6A6A6;}.td_right{padding-left: 50px ;color: #A6A6A6;}#username,#password,#email,#name,#tel,#birthday,#checkcode{width: 251px;height: 32px;border: 1px solid #A6A6A6 ;/*设置边框圆角*/border-radius: 5px;padding-left: 10px;}#checkcode{width: 110px;}#img_check{height: 32px;vertical-align: middle;}#btn_sub{width: 150px;height: 40px;background-color: #FFD026;border: 1px solid #FFD026 ;}</style>
</head>
<body><div class="rg_layout"><div class="rg_left"><p>新用户注册</p><p>USER REGISTER</p></div><div class="rg_center"><div class="rg_form"><form action="#" method="post"><table><tr><td class="td_left"><label for="username">用户名</label></td><td class="td_right"><input type="text" name="username" id="username" placeholder="请输入用户名"></td></tr><tr><td class="td_left"><label for="password">密码</label></td><td class="td_right"><input type="password" name="password" id="password" placeholder="请输入密码"></td></tr><tr><td class="td_left"><label for="email">email</label></td><td class="td_right"><input type="email" name="email" id="email" placeholder="请输入邮箱"></td></tr><tr><td class="td_left"><label for="name">姓名</label></td><td class="td_right"><input type="text" name="name" id="name" placeholder="请输入姓名"></td></tr><tr><td class="td_left"><label for="tel">手机号</label></td><td class="td_right"><input type="text" name="tel" id="tel" placeholder="请输入手机号"></td></tr><tr><td class="td_left"><label for="gender">性别</label></td><td class="td_right"><input type="radio" name="gender" value="male"> 男<input type="radio" name="gender" value="female"> 女</td></tr><tr><td class="td_left"><label for="birthday">出生日期</label></td><td class="td_right"><input type="date" name="birthday" id="birthday"></td></tr><tr><td class="td_left"><label for="checkcode">验证码</label></td><td class="td_right"><input type="text" name="checkcode" id="checkcode" placeholder="请输入验证码"><img src="data:images/verify_code.jpg" alt="验证码"></td></tr><tr><td  colspan="2" align="center" ><input type="submit" value="注册" id="btn_sub"></td></tr></table></form></div></div><div class="rg_right"><p>已有账号？<a href="#">立即登录</a></p></div></div>
</body>
</html>

注册页面（HTML+css）相关推荐

PC端品优购注册页面 resgister.css以及web服务器学习
注册页类名命名注册页面:register.html 注意:注册页面比较隐私,为了保护用户信息,我们不需要对当前页面做SEO优化注册专区: registerarea 注册内容 reg-form 错误 ...
【前端学习日志】HTML表格表单注册页面案例+CSS选择器
今日学习一.HTML部分 1.表格的基本语法 2.表头单元格标签 3.还是表头单元格标签 4.小说排行榜案例 5.合并单元格 6.无序列表 7.有序列表 8.自定义列表 9.表单域 10.Input ...
html注册页面美化,css登录界面美化
本篇文章主要介绍如何用css美化网站登录界面,需要的小伙伴参考下. 代码如下: 美化登录 *{margin:0;padding:0;}/*去掉页面样式*/ body{color:white;} .co ...
注册页面（CSS）效果图+代码
效果图代码 <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF ...
css案例，注册页面_基础案例
注册页面案例(css) <!DOCTYPE html> <html lang="ch"> <head><meta charset=&quo ...
用表单实现qq注册页面
如上图实现注册页面忽略Css样式. <!doctype html> <html> <head> <meta charset="utf-8" ...
HTML/CSS学习笔记03【CSS概述、CSS选择器、CSS属性、CSS案例-注册页面】
w3cschool菜鸟教程.CHM(腾讯微云):https://share.weiyun.com/c1FaX6ZD HTML/CSS学习笔记01[概念介绍.基本标签.表单标签][day01] HTML ...
一个注册页面的前端模板（html+css+javascript）可自适应屏幕
一个注册页面的前端模板(html+css+javascript)可自适应屏幕,修改样式即可用. 截图代码 <!DOCTYPE html> <html><head> ...
使用HTML代码完成效果图，完成www.163.com账号注册页面（不要求做css样式，原生的HTML就好）
使用HTML代码完成效果图,完成www.163.com账号注册页面(不要求做css样式,原生的HTML就好) <!DOCTYPE html> <html><head> ...
使用html，css，javascript进行注册页面的实现
注册页面的实现功能实现一个用户注册页面实现表单校验功能效果图实现步骤 1) 创建Resign.html注册页面核心代码:  <div id=" ...

注册页面（HTML+css）

注册页面（HTML+css）相关推荐

最新文章

热门文章