<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> *{ margin: 0; padding: 0; } body{ margin-top: 30px; transition: all .5s; padding: 1px; letter-spacing: 1px; } .vli{ width: 430px; margin: 0 auto; display: table; position: relative; min-height: 484px; } .vli .wrapper{ border-radius: 6px; max-width: 40%; height: 120%; background: #FFF; border: 1px solid rgb(0,0,0,.14); transition: all .5s; color: #303030; overflow: hidden; } .vli > div{ display: table-cell; vertical-align: middle; text-align: center; color: #fff; min-height: 400px; height: 400px; } #register{ padding: 15px 30px 30px; transition: all .5s; background: #fff; width: 100%; box-sizing: border-box; } .vli .wrapper div div{ position: relative; margin-bottom: 20px; box-sizing: border-box; } .vli .wrapper input{ height: 40px; padding: 5px 15px; width: 100%; border: 1px solid #ddd; border-radius: 3px; color: #353434; box-sizing: border-box; } #login p, #register p{ position: absolute; left: 17px; } .vli .wrapper h3{ margin-bottom: 20px; margin-top: 5px; } .marb0{ margin-bottom: 0 !important; } #register .pho{ width: 60%; float: left; } #register .pcd{ width: 40%; float: right; } </style> </head> <body> <div class="body"> <div class="vli"> <div class="wrapper move"> <div id="register"> <form class="form2" method="" action=""> <h3>免费注册</h3> <div class="vali"> <input type="text" name="" value="" class="Required" placeholder="必填"> <p style="font-size: 12px; display: inline; vertical-align: top; color: red;"></p></div> <div class="vali reqtps"> <input type="text" name="" value="" class="Requireds" placeholder="必填自定义提示"> <p style="font-size: 12px; display: inline; vertical-align: top; color: red;"></p></div> <div class="vali"> <input type="text" name="" value="" class="uersname" placeholder="请输入用户名"> <p style="font-size:12px;display:inline;vertical-align:top;"></p></div> <div class="vali"> <input type="text" name="" value="" placeholder="请输入中文" class="chinese"> <p style="font-size:12px;display:inline;vertical-align:top;"></p></div> <div class="vali"> <input type="text" name="" value="" placeholder="请输入数字" class="nub"> <p style="font-size:12px;display:inline;vertical-align:top;"></p></div> <div class="vali"> <input type="text" name="" value="" placeholder="请输入11位手机号" class="phone"> <p style="font-size:12px;display:inline;vertical-align:top;"></p></div> <div class="marb0"> <div class="vali pho"> <input type="text" name="" value="" placeholder="请输入验证码" class="phcode"> <p style="font-size:12px;display:inline;vertical-align:top;"></p></div> <div class="vali pcd"> <input type="button" name="" value="获取验证码" class="codebtn" disabled="disabled" style="color: rgb(150, 150, 150);"> <p style="font-size:12px;display:inline;vertical-align:top;"></p></div> <div class="cl1"></div> </div> <div class="vali"> <input type="password" name="" value="" placeholder="请填写长度为6-20个字符的密码" class="pasw"> <p style="font-size:12px;display:inline;vertical-align:top;"></p></div> <div class="vali"> <input type="password" name="" value="" placeholder="请再次输入密码" id="password" class="pasws"> <p style="font-size:12px;display:inline;vertical-align:top;"></p></div> <div class="vali"> <input type="text" name="" value="" class="eal" placeholder="请输入邮箱,邮箱格式,[email protected]"> <p style="font-size:12px;display:inline;vertical-align:top;"></p></div> <div class="vali"> <input type="text" name="" value="" class="cid" placeholder="请输入身份证"> <p style="font-size:12px;display:inline;vertical-align:top;"></p></div> <div class="submit"> <input type="submit" class="btn" value="立即注册"> </div> </form> </div> </div> </div> </div> </body> </html>
写个表单
猜你喜欢
转载自blog.csdn.net/qq_33300789/article/details/80056272
今日推荐
周排行