html5注册页面,HTML5注册页面

HTML5写注册页面

你可以考虑使用bootstrap框架，html5输入提示可以使用placeholder属性。

十多年的哈巴河网站建设经验，针对设计、前端、开发、售后、文案、推广等六对一服务，响应快，48小时及时工作处理。全网营销推广的优势是能够根据用户设备显示端的尺寸不同，自动调整哈巴河建站的显示方式，使网站能够适用不同显示终端，在浏览器中调整网站的宽度，无论在任何一种浏览器上浏览网站，都能展现优雅布局与设计，从而大程度地提升浏览体验。创新互联公司从事“哈巴河网站设计”,“哈巴河网站推广”以来，每个客户项目都认真落实执行。

html5写这个注册页面怎么写啊？

!DOCTYPE html

html

head

meta charset="utf-8" /

meta name="viewport" content="width=device-width, initial-scale=1"

titleBootstrap 4/title

link rel="stylesheet" href=""

integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"

link rel="stylesheet" href="bootstrap-colorpicker/css/bootstrap-colorpicker.css"

link rel="stylesheet" href="bootstrap-datepicker/css/bootstrap-datetimepicker.min.css"

style type="text/css"

.main-box {

width: 640px;

margin: 40px auto;

}

/style

/head

body

div class="main-box"

form

div class="form-group row"

label for="name" class="col-sm-2 col-form-label"用户名/label

div class="col-sm-10"

input type="text" class="form-control" id="name" placeholder="请输入用户名"

/div

/div

div class="form-group row"

label for="pwd" class="col-sm-2 col-form-label"密码/label

div class="col-sm-10"

input type="password" class="form-control" id="pwd" placeholder="请输入密码"

/div

/div

div class="form-group row"

label for="pwd2" class="col-sm-2 col-form-label"确认密码/label

div class="col-sm-10"

input type="password" class="form-control" id="pwd2" placeholder="请输入确认密码"

/div

/div

div class="form-group row"

label for="area" class="col-sm-2 col-form-label"区域/label

div class="col-sm-10"

select class="form-control form-control-lg" id="area"

option四川省/option

/select

/div

/div

fieldset class="form-group"

div class="row"

legend class="col-form-label col-sm-2 pt-0"性别/legend

div class="col-sm-10"

div class="form-check form-check-inline"

input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio1" value="option1"

checked="true"

label class="form-check-label" for="inlineRadio1"男/label

/div

div class="form-check form-check-inline"

input class="form-check-input" type="radio" name="inlineRadioOptions" id="inlineRadio2" value="option2"

label class="form-check-label" for="inlineRadio2"女/label

/div

/div

/div

/fieldset

div class="form-group row"

label for="age" class="col-sm-2 col-form-label"年龄/label

div class="col-sm-10"

input type="email" class="form-control" id="age" placeholder="请输入年龄"

/div

/div

div class="form-group row"

label for="age" class="col-sm-2 col-form-label"生日/label

div class="col-sm-10"

input size="16" type="text" value="2012-06-15" readonly class="form-control form_datetime"

/div

/div

div class="form-group row"

label for="phone" class="col-sm-2 col-form-label"手机号/label

div class="col-sm-10"

input type="text" class="form-control" id="phone" placeholder="请输入手机号"

/div

/div

div class="form-group row"

label for="phone" class="col-sm-2 col-form-label"头像/label

div class="col-sm-10"

input type="file" class="form-control-file" id="exampleFormControlFile1"

/div

/div

div class="form-group row"

label for="site" class="col-sm-2 col-form-label"主页/label

div class="col-sm-10"

input type="text" class="form-control" id="site" placeholder="请输入主页"

/div

/div

div class="form-group row"

label for="email" class="col-sm-2 col-form-label"Email/label

div class="col-sm-10"

input type="email" class="form-control" id="email" placeholder="请输入Email"

/div

/div

div class="form-group row"

label class="col-sm-2 col-form-label"喜欢的颜色/label

div class="col-sm-10"

input id="likeColor" type="text" class="form-control" value="#5367ce" /

/div

/div

div class="form-group row"

div class="col-sm-2"/div

div class="col-sm-10"

div class="form-check"

input class="form-check-input" type="checkbox" value="" id="defaultCheck1"

label class="form-check-label" for="defaultCheck1"

同意服务条款

/label

/div

/div

/div

div class="form-group row"

div class="col-sm-10"

button type="submit" class="btn btn-primary"注册/button

button type="submit" class="btn"取消/button

/div

/div

/form

/div

script src=""

integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"

/script

script src=""

integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"

/script

script src=""

integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"

/script

script src="bootstrap-colorpicker/js/bootstrap-colorpicker.js"/script

script src="bootstrap-datepicker/js/bootstrap-datetimepicker.min.js"/script

script

$('#likeColor').colorpicker();

$(".form_datetime").datetimepicker({

format: 'yyyy-mm-dd',

weekStart: 1,

todayBtn:  1,   //今日日期按钮

autoclose: 1,   //自动关闭

todayHighlight: 1,   //高亮今日日期

startView: 2,       //从日期视图开始

minView: 2,

forceParse: 0

});

/script

/body

/html

案例下载

怎样用html5做一个注册页面

不知道你要做到什么程度，如果只是简单地样式的话用input框就可以，然后用JS获取数据保存到cookie或者localstorage就可以。

文章名称：html5注册页面,HTML5注册页面
转载源于：https://www.cdcxhl.com/article32/dsehgsc.html

成都网站建设公司_创新互联，为您提供响应式网站、商城网站、网站策划、标签优化、服务器托管、微信小程序

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联