今天,小编将与大家分享web前端特效荟萃系列第十四期,喜欢把玩儿炫酷效果的小伙伴快快看过来^_^ ,希望大家喜欢呦~
第14期,给大家分享一个 使用Bootstrap3生成的弹出式悬浮登录框效果设计 效果,相关代码如下:
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>cloth</title> <style> @import url('http://cdn.gbtags.com/twitter-bootstrap/3.2.0/css/bootstrap.css'); body{ font-family: 'microsoft yahei',Arial,sans-serif; margin:0; padding:0; } </style> </head> <body> <div id="loginModal" class="modal show"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close">x</button> <h1 class="text-center text-primary">登录</h1> </div> <div class="modal-body"> <form action="" class="form col-md-12 center-block"> <div class="form-group"> <input type="text" class="form-control input-lg" placeholder="电子邮件"> </div> <div class="form-group"> <input type="password" class="form-control input-lg" placeholder="登录密码"> </div> <div class="form-group"> <button class="btn btn-primary btn-lg btn-block">立刻登录</button> <span><a href="#">找回密码</a></span> <span><a href="#" class="pull-right">注册</a></span> </div> </form> </div> <div class="modal-footer"> </div> </div> </div> </div> </body> </html>
在线演示:Here~
今天的分享就是这些啦,这里是igeekbar,希望可以给各位geek小伙伴们带来帮助呦~~~如果你制作出了或收藏了哪些炫酷的前端特效,赶快留言分享给我们呦~~~
注:本文内容来自互联网,旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜,请你联系站长进行处理。