css盒子4
html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin: 0px; padding: 0px; } html,body{ width: 100%; height: 100%; } body{ background: url(img/sss-bg.jpg); background-size: 100% 100%; } .box-p6{ padding-top: 100px; } .box{ width: 202px; height: 424px; border: 1px red solid; margin: 100px 100px; padding-left: 100px; padding-right: 100px; margin: 0px auto; } .box1{ color: darkblue; text-align: center; margin-top: 20px; margin-bottom: 20px; } .box-p1{ width: 200px; height: 25px; border: 1px red solid; border-radius: 20px; margin: 20px 0px; } input{ outline: none; border: none; margin-left:10px; } .box6{ width: 200px; height: 25px; background: lightcoral; border:1px lightcoral solid; border-radius: 10px; } .btn{ width: 200px; background: lightcoral; color: lightcyan; border: none; outline: none; } .box7{ padding-top: 20px; font-size: 10px; } span{ color: #00008B; } </style> </head> <body> <div class="box-p6"> <div class="box"> <div class="box1"> <h2>Register</h2> </div> <div class="box-p1"> <input placeholder="Name" name="" id="" value="" /> </div> <div class="box-p1"> <input placeholder="Email" name="" id="" value="" /> </div> <div class="box-p1"> <input placeholder="Usemame" name="" id="" value="" /> </div> <div class="box-p1"> <input placeholder="Password" name="" id="" value="" /> </div> <div class="box-p1"> <input placeholder="Repeat Password" name="" id="" value="" /> </div> <div class="box6"> <button class="btn">Sign In</button> </div> <div class="box7">Are you a member? <span class="box8">Login Now</span></div> </div> </div> </body> </html>