下面是内存溢出 jb51.cc 通过网络收集整理的代码片段。
内存溢出小编现在分享给大家，也给大家做个参考。
<!DOCTYPE HTML><HTML lang="en-US"><head> <Meta charset="UTF-8"> <Title>Twitter Login Form|w3cplus</Title> <Meta name="keywords" content="CSS3学习,CSS3属性详解,CSS3 Transition,如何学好CSS3"> <Meta name="description" content="W3CPLUS是一个前端爱好者的家园，W3CPLUS努力打造最优秀的web 前端学习的站点。W3CPLUS力求原创，以一起学习，一起进步，共同分享为原则。W3CPLUS站提供了有关于CSS,CSS3,HTML,HTML5,jquery,手机移动端的技术文档、DEMO、资源，与前端爱好者一起共勉。"> <link rel="shortcut icon" href="http://www.w3cplus.com/sites/all/themes/marvin/favicon.ico"> <link rel="stylesheet" type="text/CSS" href="http://www.w3cplus.com/demo/CSS3/base.CSS" media="all" /> <link rel="stylesheet" type="text/CSS" href="CSS/style.CSS" media="all"> <link rel="stylesheet" href="Font-awesome.CSS" /><style type="text/CSS">*,::after,::before { -webkit-Box-sizing: border-Box; -moz-Box-sizing: border-Box; -ms-Box-sizing: border-Box; -o-Box-sizing: border-Box; Box-sizing: border-Box; padding: 0; margin: 0;}body { background: #E1C192 url(wood_pattern.jpg);}.form { wIDth: 340px; margin: 60px auto 30px; padding: 15px; position: relative; background: #fffaf6; border-radius: 4px; color: #7e7975; Box-shadow:0 2px 2px rgba(0,0.2),0 1px 5px rgba(0,0 0 0 12px rgba(255,255,0.4); }.form h1 { Font-size: 15px; line-height:1; Font-weight: bold; color: #bdb5aa; padding-bottom: 8px; border-bottom: 1px solID #EBE6E2; text-shadow: 0 2px 0 rgba(255,0.8); Box-shadow: 0 1px 0 rgba(255,0.8);}.form h1 .log-in,.form h1 .sign-up { display: inline-block; text-transform: uppercase;}.form h1 .log-in { color: #6c6763; padding-right: 2px;}.form h1 .sign-up { color: #ffb347; padding-left: 2px;}.form .float { wIDth: 50%; float: left; padding-top: 15px; border-top: 1px solID rgba(255,1);}.form .float:first-of-type { padding-right: 5px;}.form .float:last-of-type { padding-left: 5px;}.form label { display: block; padding: 0 0 5px 2px; cursor: pointer; text-transform: uppercase; Font-weight: 400; text-shadow: 0 1px 0 rgba(255,0.8); Font-size: 11px;}.form label i { margin-right: 5px; /* Gap between icon and text */ display: inline-block; wIDth: 10px;}.form input[type=text],.form input[type=password] { Font: 400 13px 'Lato',Calibri,Arial,sans-serif; display: block; wIDth: 100%; padding: 5px; margin-bottom: 5px; border: 3px solID #ebe6e2; border-radius: 5px; -webkit-Transition: all 0.3s ease-out; -moz-Transition: all 0.3s ease-out; -ms-Transition: all 0.3s ease-out; -o-Transition: all 0.3s ease-out; Transition: all 0.3s ease-out;}.form input[type=text]:hover,.form input[type=password]:hover { border-color: #CCC;}.form label:hover ~ input { border-color: #CCC;}.form input[type=text]:focus,.form input[type=password]:focus { border-color: #BBB; outline: none; /* Remove Chrome's outline */}.form input[type=submit],.form .log-twitter { wIDth: 49%; height: 38px; float: left; position: relative; Box-shadow: inset 0 1px rgba(255,0.3); border-radius: 3px; cursor: pointer; Font:bold 14px/38px 'Lato',sans-serif ; text-align: center;}.form input[type=submit] { margin-left: 1%; background: #fbd568; /* Fallback */ background: -moz-linear-gradIEnt(#fbd568,#ffb347); background: -ms-linear-gradIEnt(#fbd568,#ffb347); background: -o-linear-gradIEnt(#fbd568,#ffb347); background: -webkit-gradIEnt(linear,0 0,0 100%,from(#fbd568),to(#ffb347)); background: -webkit-linear-gradIEnt(#fbd568,#ffb347); background: linear-gradIEnt(#fbd568,#ffb347); border: 1px solID #f4ab4c; color: #996319; text-shadow: 0 1px rgba(255,0.3);}.form .log-twitter { margin-right: 1%; background: #34a5cf; /* Fallback */ background: -moz-linear-gradIEnt(#34a5cf,#2a8ac4); background: -ms-linear-gradIEnt(#34a5cf,#2a8ac4); background: -o-linear-gradIEnt(#34a5cf,#2a8ac4); background: -webkit-gradIEnt(linear,from(#34a5cf),to(#2a8ac4)); background: -webkit-linear-gradIEnt(#34a5cf,#2a8ac4); background: linear-gradIEnt(#34a5cf,#2a8ac4); border: 1px solID #2b8bc7; color: #ffffff; text-shadow: 0 -1px rgba(0,0.3); text-decoration: none;}.form input[type=submit]:hover,.form .log-twitter:hover { Box-shadow:inset 0 1px rgba(255,0.3),inset 0 20px 40px rgba(255,0.15);}.form input[type=submit]:active,.form .log-twitter:active{ top: 1px;}/* Fallback fro broswers that don't support Box shadows */.no-Boxshadow .form input[type=submit]:hover { background: #ffb347;}.no-Boxshadow .form .log-twitter:hover { background: #2a8ac4;}.form p:last-of-type { clear: both; }.form .opt { text-align: right; margin-right: 3px;}.form label[for=showPassword] { display: inline-block; margin-bottom: 10px; Font-size: 11px; Font-weight: 400; text-transform: cAPItalize;}.form input[type=checkBox] { vertical-align: mIDdle; margin: -1px 5px 0 1px;}</style> </head><body><div > <nav ID="top_nav"> <ul > <li><a href="http://www.w3cplus.com" target="_blank">w3cplus</a></li> <li><a href="http://www.w3cplus.com/resources/CSS3-tutorial-and-case" target="_blank">CSS3详解教程</a></li> <li><a href="http://www.w3cplus.com/demos/List.HTML" target="_blank">CSS3实例</a></li> <li><a href="http://www.w3cplus.com/demo/Tags/242.HTML" target="_blank">藤藤每日一练</a></li> </ul> <a ID="read" href="http://www.w3cplus.com/demo/twitter-login-or-signup-form-with-CSS3.HTML" target="_blank">查看原文>></a> </nav></div><div > <header ID="header"> <hgrounp > <h1>Twitter Login Form</h1> <h2>作者：大漠(如有更好建议或疑问请加群：1041263)<h2> </hgrounp> </header> <section > <form > <h1><span >Log in</span> or <span >sign up</span></h1> <p > <label for="login"><i ></i>Username</label> <input type="text" name="login" placeholder="Username or email"> </p> <p > <label for="password"><i ></i>Password</label> <input type="password" name="password" placeholder="Password" > </p> <p > <input type="checkBox" ID="showPassword"> <label for="showPassword">Show password</label> </p> <p > <a href="#" >Log in with Twitter</a> <input type="submit" name="submit" value="Log in"> </p> </form> </section> <section ID="ad_w3cplus"> <script type="text/JavaScript">/*120*270，创建于2012-10-14*/var cpro_ID = "u1089160";</script><script src="http://cpro.baIDustatic.com/cpro/ui/f.Js" type="text/JavaScript"></script> <div > <script type="text/JavaScript">/*250*250，创建于2012-10-14-3*/var cpro_ID = "u1089145";</script><script src="http://cpro.baIDustatic.com/cpro/ui/c.Js" type="text/JavaScript"></script> </div> <div > <script type="text/JavaScript">/*250*250，创建于2012-10-14-2*/var cpro_ID = "u1089141";</script><script src="http://cpro.baIDustatic.com/cpro/ui/c.Js" type="text/JavaScript"></script> </div> <div > <script type="text/JavaScript">/*250*250，创建于2012-10-11*/var cpro_ID = "u1086065";</script><script src="http://cpro.baIDustatic.com/cpro/ui/c.Js" type="text/JavaScript"></script> </div> <p><script type="text/JavaScript">var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baIDu.com/h.Js%3F177319b798978621f83845b12c86fa29' type='text/JavaScript'%3E%3C/script%3E"));</script></p> </section></div></body></HTML> 以上是内存溢出(jb51.cc)为你收集整理的全部代码内容，希望文章能够帮你解决所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
总结以上是内存溢出为你收集整理的Twitter Login Or Signup Form全部内容，希望文章能够帮你解决Twitter Login Or Signup Form所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）