淡蓝风格的手机登录HTML模板

查看效果:http://hovertree.com/texiao/mobile/10/或者手机扫描二维码查看效果:效果图:代码如下:转自:http://hovertree.com/h/bjaf/l

大家好,又见面了,我是全栈君,今天给大家准备了Idea注册码。

查看效果:http://hovertree.com/texiao/mobile/10/

或者手机扫描二维码查看效果:
淡蓝风格的手机登录HTML模板

效果图:
淡蓝风格的手机登录HTML模板

代码如下:

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width" name="viewport" /> <meta content="initial-scale=1.0,user-scalable=no,maximum-scale=1" media="(device-height: 568px)" name="viewport"> <meta content="yes" name="apple-mobile-web-app-capable" /> <meta content="black" name="apple-mobile-web-app-status-bar-style" /> <meta content="telephone=no" name="format-detection" /> <title>移动端HTML5登录模板 - 何问起</title> <style> body { margin: 0; padding: 0; color: #666; background: #c1d2fe; font-family: Verdana, sans-serif } .form_login { max-width: 640px; margin: auto; text-align: center; padding-top: 100px; } .form-group { width: 355px; margin: 0 auto; height: 50px; margin-bottom: 20px; } .form-group .fa { display: block; width: 50px; height: 50px; float: left; } .form-group .form-control { display: block; width: 300px; height: 48px; float: left; border: 1px solid #ccc; padding: 0; margin-left: 0; text-indent: 1em; themeColor: #00a988; } .form-group .form-control:hover { border: 1px solid #0160A0; } .form-group .checkfont { color: #666; } .form-group .btn { width: 350px; height: 50px; background-color: #0160A0; border: 0px; color: #fff; font-size: 14px; } .fa-user { background: url(http://hovertree.com/texiao/mobile/10/images/user.png) no-repeat center; } .fa-key { background: url(http://hovertree.com/texiao/mobile/10/images/pw.png) no-repeat center; } .hovertree_form_footer { margin-top: 100px; font-size: 14px; color: #5B809A; } .form_logo{font-size:26px;}a{color:gray} </style> </head> <body> <div class="form_login"> <div class="form_logo"><img src="http://hovertree.com/themes/hvtimages/hlogo.png" /> <br /> 何问起管理系统</div> <form method="post" role="form" id="form_login"> <div class="form-group"> <i class="fa fa-user"></i> <input type="text" class="form-control" name="username" id="username" placeholder="Username" autocomplete="off"> </div> <div class="form-group"> <i class="fa fa-key"></i> <input type="password" class="form-control" name="password" id="password" placeholder="Password" autocomplete="off"> </div> <div class="form-group" style="height:25px; line-height:25px; text-align:left;"> <input type="checkbox" class="" name="checkbox" id="checkbox" placeholder="checkbox" autocomplete="off"> <label class="checkfont" for="checkbox" >记住我的帐号</label> </div> <div class="form-group"> <button type="submit" class="btn btn-primary btn-block btn-login">登录</button> <br /><a href="http://hovertree.com/h/bjaf/loucldil.htm" target="_blank">查看代码</a> <a href="http://hovertree.com" target="_blank">首页</a> <a href="http://hovertree.com/texiao/" target="_blank">特效</a> </div> </form> <div class="hovertree_form_footer">&copy; 何问起 hovertree.com</div> </div> </body> </html>

转自:http://hovertree.com/h/bjaf/loucldil.htm

推荐:http://hovertree.com/hvtart/bjae/jftxwtko.htm

更多特效:http://www.cnblogs.com/roucheng/p/texiao.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/120601.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • socketpair原理_socket负载均衡

    socketpair原理_socket负载均衡描述先看下传统的CS模型,如下:总是一方发起请求,等待另一方回应。当一次传输完成之后,client端发起新的请求之后,server端才作出回应。那如何才能做到双向通信? 一种解决办法就是client端即使client,又是server,server端即使client也是server,如下:但是上述方面比较复杂,这时候就引入要分析的socketpair了。

    2022年10月14日
  • HDU 4825 Xor Sum 字典树+位运算

    HDU 4825 Xor Sum 字典树+位运算

  • Vue电商后台管理系统(1)

    Vue电商后台管理系统(1)Vue电商后台管理系统(1)登录在components文件夹下创建登录组件,Login.vue,并快速生成template、script和style骨架。配置路由,进入router文件夹,导入Login组件,创建路由并重定向首页为登录界面,进入首页时会自动跳转至登录页面,配置如下:绘制页面:<template><divclass=”login_container”><divclass=”login_box”><!–

  • thinkphp3.2.2邮箱发送

    thinkphp3.2.2邮箱发送

  • ffmpeg安装失败_linux离线安装ffmpeg

    ffmpeg安装失败_linux离线安装ffmpeg./configure–enable-static–enable-version3–enable-gpl–enable-nonfree–enable-libfdk-aac–enable-libopencore-amrnb–enable-libopencore-amrwb–enable-libvo-amrwbenc–enable-libilbc–enable-…

  • LDR命令

    LDR命令  LDR指令用于从内存中将一个32位的字读取到指令中的目标寄存器中,如果目标寄存器为PC,则可以实现“长”跳转。主要有一下3种方式使用:ldrr0,_startldrr0,=_startldrpc,_start  逐条分析:一、ldrr0,_start  从内存地址_start的地方,把其对应的命令执行对应的“执行码”读入到r0中。二、ldrr0,=_start  …

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号