个人账户页面设置邮箱绑定改善

account-set.html

		</div>
        <form class="bdfrm" action="" name="bdemail">
        	<p>绑定邮箱验证链接已发送至</p>
        	<p class="emalvel"></p>
        	<p class="emalvel" style="color:#FF9900"></p>
            <p style="font-size: 12px;">请您在10分钟内登录邮箱激活链接验证</p>
            <div style="text-align: center;">
           		 <input type="button" value="登录邮箱完成验证" class="activate act-color" style="width:160px" id="bindgo">
        	<p>验证您的手机号，完成手机账号绑定</p>
            <input type="text" placeholder="请输入您的手机号" class="yz" id="phone" onBlur="valPhone()">
            <div class="msg-yz msg12"></div>
            <input type="text" placeholder="请输入短信验证码" class="psd input-code" maxlength="4" id="phoneCode"  onBlur="valCode()">
            <input type="text" placeholder="请输入短信验证码" class="psd input-code" style="height:36px;" maxlength="4" id="phoneCode"  onBlur="valCode()">
            <input type="button" value="获取短信验证码" class="infor-code" onClick="sendPhoneCode()">
            <div class="msg-yz msg13"></div>
            <div style="text-align: center;">

css/index.css

/*------------------------------------------------------------------------------------*/
/*账号设置*/
.account{ width:1050px; min-height:100px; margin:auto; padding: 40px 0;}
.account-set{ width:18%; min-height: 260px; float:left; background:#f8f8f8; border-radius:6px; margin-top:50px; overflow:hidden;}
.account-title{ height:58px; padding:0 30px;font-size:18px;line-height:68px;color:#a3a3a3;}
.leftsidebar{ display:block; width:100%; height:40px; padding-left:50px;font-size:16px;line-height:40px; color:#313131;}
.account-set{ width:12%; min-height: 260px; float:left; background:#f8f8f8; border-radius:6px; margin-top:50px; overflow:hidden;}
.account-title{ height:58px; padding:0 20px;font-size:17px;line-height:68px;color:#a3a3a3;}
.leftsidebar{ display:block; width:100%; height:40px; padding-left:30px;font-size:15px;line-height:40px; color:#313131;}
.bgcolor{ background:#ff9900; color:#fff;}
.leftsidebar:hover{ background:#ff9900; color:#fff;}
.contentbox{  width:80%; float: right;overflow:hidden;margin:40px 0;}
.contentbox{  width:87%; float: right;overflow:hidden;margin:40px 0;}
.content-set{ width:100%;  min-height: 460px; background:#f8f8f8; border-radius:6px; padding-bottom: 20px;margin:10px 0; overflow:hidden; display:none;}
.content-set:first-child{ display:block;}
.content-set form{ width: 600px;margin: auto;padding: 10px;}
.content-title{height:58px;padding:0 30px;font-size:18px;line-height:64px; color:#313131; border-bottom:1px #c8c8c8 solid;}
.content-title{height:58px;padding:0 30px;font-size:17px;line-height:64px; color:#313131; border-bottom:1px #c8c8c8 solid;}
.content-main{ padding:0 20px;}
.note{ width:438px;padding: 10px; margin:20px auto 10px;font-size:14px;color:#818181; text-align:center; border-bottom:1px #c8c8c8 dashed;}
.note p{line-height:20px;}
.coverblock{ width:100%; height:100%; background:rgba(0,0,0,0.6); position:fixed; z-index:1004; display:none;}
.floatbox{ /*width:400px;*/ padding: 0 20px 10px 20px;box-shadow:1px 1px 8px #9f9d9d; border-radius:6px;background:#fff; position:absolute; top:80px; left:50%; margin-left:-240px;  margin-bottom:40px;}
.float-title{  height:60px;border-bottom: 1px #ff9900 solid;font-size:18px;line-height:60px; color:#818181; padding:0 20px;}
.times{ background:url(../images/workclose.png) center center no-repeat; position:absolute; top:10px; right:-30px;width: 24px;height: 24px; z-index: 1005; cursor:pointer; }
.times{ background:url(../images/workclose.png) center center no-repeat; position:absolute; top:6px; right:-36px;width: 24px;height: 24px; z-index: 1005; cursor:pointer; }
.bdfrm{ padding:10px 30px 60px 30px; }
.yz{ width:350px; height:44px; border-radius:6px; border:1px #bdbdbd solid; box-shadow:0px 0px 2px #bdbdbd inset; padding-left:20px; margin:10px;}
.bdfrm{ padding:20px 30px 40px 30px; }
.yz{ width:350px; height:36px; border-radius:6px; border:1px #bdbdbd solid; box-shadow:0px 0px 2px #bdbdbd inset; padding-left:20px; margin:10px;}
.cover p{ clear:both;font-size:16px;line-height:26px; color:#818181; text-align:center; margin:20px 0;}
.coverset p{ clear:both;font-size:16px;line-height:26px; color:#818181; text-align:center; margin:10px 0;}
.cover2 p{ clear:both;font-size:16px;line-height:26px; color:#818181; text-align:center; margin:20px 0;}
.activate{ width:140px; height:38px; background:#fff;font-size:16px;line-height:35px; color:#333; cursor:pointer; border:none; border-radius:6px; margin:auto; margin-top:30px;  }
.cover p{ clear:both;font-size:15px;line-height:26px; color:#818181; text-align:center; margin:10px 0;}
.coverset p{ clear:both;font-size:15px;line-height:26px; color:#818181; text-align:center; margin:10px 0;}
.cover2 p{ clear:both;font-size:15px;line-height:26px; color:#818181; text-align:center; margin:10px 0;}
.activate{ width:140px; height:32px; background:#fff;font-size:14px;line-height:30px; color:#333; cursor:pointer; border:none; border-radius:6px; margin:auto; margin-top:10px;  }
.act{margin-left:40px;}
.act-color{background:#ff9900;color:#fff;}
.back-btn:hover{background:#ff9900;color:#fff;cursor:pointer;}
.input-code{ width: 210px;margin-left: 10px;}
.infor-code{ width:130px; height:40px; background:#ff9900; border:none; border-radius:6px;font-size:14px;line-height:35px; color:#fff; cursor:pointer; margin-left:5px;}
.infor-code{ width:130px; height:36px; background:#ff9900; border:none; border-radius:6px;font-size:14px;line-height:35px; color:#fff; cursor:pointer; margin-left:5px;}
/*------------------------------------------------------------------------------------*/
/*专家信息页*/

css/login.css

.boxnav-title{font-size: 14px; line-height:40px; font-weight: normal;position:relative;padding-left:2%;}
ul.boxnav{ overflow: hidden;width:100%;}
ul.boxnav li{list-style: none;width:33.333%;float:left; padding:0 10px;-webkit-box-sizing: border-box;}
ul.boxnav li span{width:100%; font-size:12px;height:28px; line-height:26px; text-align: center; display: block; background: #fff;  border-radius: 5px;}
ul.boxnav li span{width:100%; font-size:12px;height:28px; line-height:26px; text-align: center; display: block; background: #fff;  border-radius: 5px;cursor: pointer;}
ul.boxnav li:nth-child(1) span{border:1px solid #ff9900; color: #ff9900; }
ul.boxnav li:nth-child(2) span{border:1px solid #6699ff; color: #6699ff; }
ul.boxnav li:nth-child(3) span{border:1px solid #66cc00; color: #66cc00; }
ul.boxnav li.set span{
  background:url(../images/choiceIcon.png) no-repeat;pading-left:4px;}
ul.boxnav li.set:nth-child(1) span{border:1px solid #ff9900; color: #fff; background-color: #ff9900; background-position: 11px center; }
ul.boxnav li.set:nth-child(2) span{border:1px solid #6699ff; color: #fff; background-color: #6699ff; background-position: 17px center; }
ul.boxnav li.set:nth-child(3) span{border:1px solid #66cc00; color: #fff; background-color: #66cc00; background-position: 22px center; }
ul.boxnav li.set span{background:url(../images/choiceIcon.png) no-repeat;pading-left:4px;}
ul.boxnav li.set:nth-child(1) span{border:1px solid #ff9900; color: #fff; background-color: #ff9900; background-position: 10px center; }
ul.boxnav li.set:nth-child(2) span{border:1px solid #6699ff; color: #fff; background-color: #6699ff; background-position: 16px center; }
ul.boxnav li.set:nth-child(3) span{border:1px solid #66cc00; color: #fff; background-color: #66cc00; background-position: 21px center; }
.IdentityState{margin: 20px;background: #fff;padding: 100px 10px 100px 10px; text-align:center;}
.IdentityState p{padding:10px; margin:10px;}