<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Title</title> <style> *{ margin: 0; } body{ font-size: 12px; } body a { text-decoration:none; color: blue; } .header{ width: 100%; height: 48px; /*background-color: darkgray;*/ } .headerCon{ width:70% ; height: 48px; background-color: white; margin: 0 auto; line-height: 48px; } .keep{ margin-right: 900px; margin-left: 60px; } .headerCon a{ text-decoration: none; color: black; } .headerCon a:hover{ color: red; text-decoration: underline; } .action a{ margin-left: 10px; } .content{ width: 100%; position: relative; } .box{ width: 70%; margin: 0 auto; } .bigBox{ border: 1px solid lightgray; overflow: hidden; } .h1{ margin-bottom: 50px; margin-left: -20px; } .form,.guangao{ float: left; } .form{ width: 60%; margin-left: 100px; margin-top: 30px; } .form_con{ text-align: right; margin-right: 500px; } .guangao{ width: 30%; } p{ margin: 20px; } .form_con a{ text-decoration:none; color: blue; } .button{ margin-top: 30px; margin-right: 10px; margin-bottom: 80px; background-color: red; color: white; width: 190px; height:25px; } .guangao p{ margin-left: 0; margin-top:70px; } .guangao img{ margin-left: 0; margin-top: 20px; } .intro p{ text-align: center; } </style> </head> <body> <div class="header"> <div class="headerCon"> <span class="keep"> <a href="">*收藏本站</a> </span> <span class="action"> <a href="">登录</a> <a href="">注册</a> <a href="">我的订单</a> <a href="">VIP 会员俱乐部</a> <a href="">客户服务</a> </span> </div> </div> <div class="content"> <div class="box"> <div class="img"> <img src="mei.png" alt="" width="220" height="140"> </div> <div class="bigBox"> <div class="form"> <h1 class="h1">注册新用户</h1> <form class="form_con" action=""> <p>*用户名： <input type="text"></p> <p>*手机号： <input type="text"></p> <p>*登录密码： <input type="password"></p> <p>*确认密码： <input type="password"></p> <p> *验证码： <input type="text" > <!--<img src="a.png" alt="" width="20px" height="20px">--> </p> <input type="checkbox">我已阅读并同意 <a href="">《用户注册协议》</a> <button class="button">同意以上协议并注册</button> </form> </div> <div class="guangao"> <p>我已经注册，现在就 <a href="">登录</a></p> <img src="2.png" alt="" width="300" height="100"> </div> </div> <div class="intro"> <p>@ 2004-2015 www.autohome.com.cn ALL Right Reserved.汽车之家 版权所有</p> </div> </div> </div> </body> </html>
