首页>>表单>>html 和css写的登录/注册代码，切换登录或者注册表单(2015-04-24)

html 和css写的登录/注册代码，切换登录或者注册表单

html 和css写的登录/注册代码，切换登录或者注册表单
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div id="wrapper">  
  2.                         <div id="login" class="animate form">  
  3.                             <form  action="mysuperscript.php" autocomplete="on">   
  4.                                 <h1>Log in</h1>   
  5.                                 <p>   
  6.                                     <label for="username" class="uname" data-icon="u" > Your email or username </label>  
  7.                                     <input id="username" name="username" required="required" type="text" placeholder="myusername or mymail@mail.com"/>  
  8.                                 </p>  
  9.                                 <p>   
  10.                                     <label for="password" class="youpasswd" data-icon="p"> Your password </label>  
  11.                                     <input id="password" name="password" required="required" type="password" placeholder="eg. X8df!90EO" />   
  12.                                 </p>  
  13.                                 <p class="keeplogin">   
  14.                                     <input type="checkbox" name="loginkeeping" id="loginkeeping" value="loginkeeping" />   
  15.                                     <label for="loginkeeping">Keep me logged in</label>  
  16.                                 </p>  
  17.                                 <p class="login button">   
  18.                                     <input type="submit" value="Login" />   
  19.                                 </p>  
  20.                                 <p class="change_link">  
  21.                                     Not a member yet ?  
  22.                                     <a href="#toregister" class="to_register">Join us</a>  
  23.                                 </p>  
  24.                             </form>  
  25.                         </div>  
  26.   
  27.                         <div id="register" class="animate form">  
  28.                             <form  action="mysuperscript.php" autocomplete="on">   
  29.                                 <h1> Sign up </h1>   
  30.                                 <p>   
  31.                                     <label for="usernamesignup" class="uname" data-icon="u">Your username</label>  
  32.                                     <input id="usernamesignup" name="usernamesignup" required="required" type="text" placeholder="mysuperusername690" />  
  33.                                 </p>  
  34.                                 <p>   
  35.                                     <label for="emailsignup" class="youmail" data-icon="e" > Your email</label>  
  36.                                     <input id="emailsignup" name="emailsignup" required="required" type="email" placeholder="mysupermail@mail.com"/>   
  37.                                 </p>  
  38.                                 <p>   
  39.                                     <label for="passwordsignup" class="youpasswd" data-icon="p">Your password </label>  
  40.                                     <input id="passwordsignup" name="passwordsignup" required="required" type="password" placeholder="eg. X8df!90EO"/>  
  41.                                 </p>  
  42.                                 <p>   
  43.                                     <label for="passwordsignup_confirm" class="youpasswd" data-icon="p">Please confirm your password </label>  
  44.                                     <input id="passwordsignup_confirm" name="passwordsignup_confirm" required="required" type="password" placeholder="eg. X8df!90EO"/>  
  45.                                 </p>  
  46.                                 <p class="signin button">   
  47.                                     <input type="submit" value="Sign up"/>   
  48.                                 </p>  
  49.                                 <p class="change_link">    
  50.                                     Already a member ?  
  51.                                     <a href="#tologin" class="to_register"> Go and log in </a>  
  52.                                 </p>  
  53.                             </form>  
  54.                         </div>  
  55.                           
  56.                     </div>  

 


原文地址:http://www.freejs.net/article_biaodan_463.html