版权归作者所有，转载请注明出处
表单验证
<!DOCTYPE html>
<!-- saved from url=(0230)file:///D:/Program%20Files%20(x86)/2020%E4%B8%8A%E8%AF%BE%E8%B5%84%E6%96%99/web%20%20html5/20171041097%E6%9D%9C%E4%BD%A9%E8%8A%B8web%E4%BD%9C%E4%B8%9A/%E7%AC%AC3%E6%AC%A1%E4%BD%9C%E4%B8%9A/%E8%A1%A8%E5%8D%95%E9%AA%8C%E8%AF%81.html -->
<html><head lang="en"><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>员工信息登记表</title>
<style type="text/css">
*{
padding: 100;
margin: 100;
list-style: none;
}
div{
padding-left:200px;
margin: 0 auto;
border:5px solid rgb(20, 98, 161);
width: 50%;
height: 600px;
text-align:left;
background:rgb(250, 153, 213);
}
</style>
</head>
<body>
<div>
<br>
<h1>员工信息登记表</h1>
<br>
<form action="file:///D:/Program%20Files%20(x86)/2020%E4%B8%8A%E8%AF%BE%E8%B5%84%E6%96%99/web%20%20html5/20171041097%E6%9D%9C%E4%BD%A9%E8%8A%B8web%E4%BD%9C%E4%B8%9A/%E7%AC%AC3%E6%AC%A1%E4%BD%9C%E4%B8%9A/%E8%A1%A8%E5%8D%95%E9%AA%8C%E8%AF%81.html#" method="post">
<!--text单行文本输入框-->
用户登录名：<input type="text" value="张三" maxlength="20"><br><br>
真实姓名： <input type="text" maxlength="4">（必填，只能输入汉字）<br><br>
真实年龄： <input type="text" maxlength="3">（必填）<br><br>
出生日期： <input type="text" maxlength="10">（必填）<br><br>
电子邮箱： <input type="text" maxlength="20">（必填）<br><br>
身份证号： <input type="text" maxlength="18">（必填，能够以数字、字母x结尾的短身份证号）<br><br>
手机号码： <input type="search">（必填）<br><br>
幸运颜色：<input type="color" value="#fff" style="width:100px;height: 30px;">（请选择你喜欢的颜色）<br><br>
<!--submit提交按钮-->
<input type="submit" value="提交" style="width:100px;height: 30px;">
<!--reset重置按钮-->
<input type="reset" value="重置" style="width:100px;height: 30px;">
</form>
</div>
</body>
</html>
效果图：
