web-前端之员工界面修改的form表单，其中包含各种表单的简单表达
程序员文章站
2022-04-10 23:37:46
...
这个是简单介绍一下员工个人信息的表单
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<style>
.addVip{
/*border: 1px solid black;*/
width: 100%;
height: 1000px;
background-color: #F0F3F4;
padding-top: 50px;
padding-left: 50px;
}
.rform{
/*border: 1px solid black;*/
width: 800px;
height:600px;
margin-top: 20px;
margin-left: 150px;
border-color: #E2E8EA;
background-color: #FFFFFF;
}
.top1{
/*border: 1px solid black;*/
width: 800px;
height: 50px;
margin-top: -20px;
background-color: #F6F8F8;
}
.top1 p{
padding-top: 10px;
color: ;
font-family: "隶书";
font-size: 20px;
padding-left: 5px;
}
.rif{
/*border: 1px solid black;*/
width: 400px;
height: 420px;
margin-left:250px;
margin-top: 70px;
color: #979797;
}
textarea{
margin-left: 80px;
margin-top: -30px;
}
.password input{
width: 250px;
height: 20px;
}
.name input{
width: 250px;
height: 20px;
}
.birthday input{
width: 250px;
height: 20px;
}
.home input{
width: 250px;
height: 20px;
}
.phone input{
width: 250px;
height: 20px;
}
.name1 p{
padding-left: 36px;
margin-top: -6px;
}
.data1 p{
padding-left: 40px;
margin-top: -6px;
}
.home1 p{
padding-left: 45px;
margin-top: -2px;
}
.tijiao{
margin-left: 60px;
}
.tijiao button{
/*border: 1px solid black;*/
width: 70px;
height: 40px;
border-color: #23B7E5;
background-color: #23B7E5;
color: white;
}
</style>
</head>
<body>
<div class="addVip">
<div class="rform">
<div class="top1">
<p>员工修改</p>
</div>
<div class="rif">
<form action="index.html" name="" method="get">
<div class="name">
<p>
姓名:<input name="user" type="text"/>
<div class="name1">
<p><img src="img/locked.png" /> 请输入与身份证上一致的姓名</p>
</div>
</p>
</div>
<div class="sex">
<p>
性别:
<input type="radio" name="sex" value="男" />男
<input type="radio" name="sex" value="女" />女
</p>
</div>
<div class="birthday">
<p>
出生日期:
<input name="date" type="datetime-local"/><br />
<div class="data1">
<p ><img src="img/locked.png" /> 与身份证信息相同</p>
</div>
</p>
</div>
<div class="home">
<p>
<p>家庭住址：</p>
<textarea rows="5" cols="20"></textarea>
<div class="home1">
<p ><img src="img/locked.png" /> 请填写现在的住址</p>
</div>
</p>
</div>
<div class="phone">
<p>
手机号
<input type="text" name="pn"/>
</p>
</div>
<div class="tijiao">
<a href="index.html">
<button>修改</button>
</a>
</div>
</form>
</div>
</div>
</div>
</body>
</html>