很漂亮的用户登录界面HTML模板
效果预览:http://keleyi.com/keleyi/phtml/divcss/21.htm
HoverTree开源项目实现了分层后,准备实现管理员后台登录,这里先把登录界面的HTML模板整理好。
推荐:http://hovertree.com/h/bjaf/loucldil.htm
html代码:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title>很漂亮的用户登录界面HTML模板-柯乐义</title><base target="_blank" /> <style> *{padding:0px; margin:0px; } a{color:White} body{font-family:Arial, Helvetica, sans-serif; background:url(http://keleyi.com/keleyi/phtml/divcss/21/images/grass.jpg) no-repeat center; font-size:13px; } img{border:0; } .lg{width:468px; height:468px; margin:100px auto; background:url(http://keleyi.com/keleyi/phtml/divcss/21/images/login_bg.png) no-repeat;} .lg_top{ height:200px; width:468px;} .lg_main{width:400px; height:180px; margin:0 25px;} .lg_m_1{width:290px; height:100px; padding:60px 55px 20px 55px; } .ur{height:37px; border:0; color:#666; width:236px; margin:4px 28px; background:url(http://keleyi.com/keleyi/phtml/divcss/21/images/user.png) no-repeat; padding-left:10px; font-size:16pt; font-family:Arial, Helvetica, sans-serif; } .pw{height:37px; border:0; color:#666; width:236px; margin:4px 28px; background:url(http://keleyi.com/keleyi/phtml/divcss/21/images/password.png) no-repeat; padding-left:10px; font-size:16pt; font-family:Arial, Helvetica, sans-serif; } .bn{width:330px; height:72px; background:url(http://keleyi.com/keleyi/phtml/divcss/21/images/enter.png) no-repeat; border:0; display:block; font-size:18px; color:#FFF; font-family:Arial, Helvetica, sans-serif; font-weight:bolder;} .lg_foot{height:80px; width:330px; padding: 6px 68px 0 68px; } </style> </head><body class="b"> <div class="lg"> <form action="#" method="POST"> <div class="lg_top"></div> <div class="lg_main"> <div class="lg_m_1"><input name="username" value="hovertree" class="ur" /> <input name="password" type="password" value="keleyi.com" class="pw" /></div> </div> <div class="lg_foot"> <input type="button" value="点这里登录" class="bn" /></div> </form> </div> <div style="text-align:center;"> <p><a href="http://keleyi.com/">首页</a> <a href="http://keleyi.com/keleyi/phtml/">特效库</a> <a href="http://keleyi.com/a/bjae/6asac24d.htm">原文</a></p> </div> </body> </html>
下载地址:http://files.cnblogs.com/jihua/hovertreelogin.rar
web前端资源:http://www.cnblogs.com/jihua/p/webfront.html
很漂亮的用户登录界面HTML模板相关推荐
- Bootstrap4+MySQL前后端综合实训-Day06-AM【eclipse详细配置Tomcat、开发web项目、servlet、连接MySQL8.0数据库、用户登录界面的编写与验证、分页查询】
[Bootstrap4前端框架+MySQL数据库]前后端综合实训[10天课程 博客汇总表 详细笔记][附:实训所有代码] 目 录 eclipse重置视图 MySQL数据库--建数据库.建数据库 s ...
- android studio 微信登录界面,如何使用Android Studio开发用户登录界面
满意答案 zhou9081 2016.05.21 采纳率:51% 等级:7 已帮助:411人 如何使用Android Studio开发用户登录界面,具体解决方案如下: 解决方案1: <:t ...
- idea中创建maven依赖下的web工程(一)----用户登录界面
如果你对idea中创建maven依赖下的web工程不是很了解,请参见上一篇博客--idea中创建maven依赖下的第一个web工程 各路大神对于idea的基本操作已经非常的熟悉了, 嗯,我还是一只入门 ...
- HTML+CSS+JavaScript制作登录页面_科幻后台登录界面html模板_科技感登录界面html模板
科幻后台登录界面html模板 原始HTML+CSS+JS页面设计,这是一个不错的登录网页制作,画面精明,非常适合初学者学习使用. 作品介绍 1.网页作品简介方面 :蓝色科技风格后台登录框,科幻的网站后 ...
- 用户登录界面 - 记事本风格HTML代码
简介: 这是一个记事本风格的用户登录界面,非常逼真,HTML 代码已经改成了中文的,经过测试,兼容 IE6+.Firefox.Chrome 等浏览器. 优化了自适应问题. 喜欢的可以下载. 从dowe ...
- php简单的登录界面,PHP实现简单用户登录界面
用PHP实现简单的用户登录界面,供大家参考,具体内容如下 首先要实现用户登录界面需要一个html登录表单 用户名: 密码: 重复密码: 然后开始按照流程图写PHP代码 if(trim($_POST[' ...
- 用Java实现用户登录界面
基本步骤 1.创建一个窗体 2.给按钮加上监听 3.获取界面输入框中的值给监听 4.存储用户信息 5.实现登录注册逻辑 1.创建一个窗体 public void LE(){JFrame jf=new ...
- [bat] cmd命令进入用户登录界面和屏幕保护程序
[bat] cmd命令进入用户登录界面和屏幕保护程序 cmd命令进入用户登录界面 rundll32.exe user32.dll,LockWorkStation cmd命令进入屏幕保护程序 C:\Wi ...
- win10启动后黑屏很久才进入登录界面
问题描述 电脑某次更新后启动速度变得非常慢,主要表现在黑屏很久才能进入登录界面,以前开机差不多十秒就完成了. 网上搜索了各种解决办法,包括:禁用所有非Microsoft服务:关闭ULPS,但是注册表中 ...
最新文章
- POJ_1976 A Mini Locomotive (dp)
- flink state ttl
- 百度feeds联盟软件测试开发,UI 自动化测试用例整理举例-百度首页
- java hanoi塔问题_java 解决汉诺塔问题
- 揭开网络编程常见API的面纱【下】
- 笔记——常用网站总结
- 接口测试工具之抓包工具介绍
- CSS3魔法堂:说说Multi-column Layout
- ai带来的革命_Covid-19将加速AI医疗保健革命
- 江苏省南京市谷歌高清卫星地图下载
- plotyy函数_plotyy函数参数设置
- C语言 打印2的n次方
- HashMap的原理及扩容
- MATLAB AppDesigner 中TextArea保留原有信息并换行显示提示信息
- ps技巧:从黑白图片中创建蒙版
- 用计算机pol计算方位角,如何通过编程代替计算器内部函数“Pol和Rec”
- 分享一下自己做电影解说的步骤流程和经验,小白必看!
- daemon 守护线程
- 看,抽签问题还能这样写。。
- MWeb入门-MWeb mac外部模式详细介绍
热门文章
- cad二次开发C#学习记录5——导出属性块信息
- 辣味人生:享受有辣而不辣
- Python学习(1)OpenCV读取图片
- java pgp加密_基于Java Bouncy Castle的PGP加密解密示例
- Android4.4以上系统选择将第三方短信应用设置为默认短信应用方法
- 【问题】C4D中设置了界面颜色,如何恢复默认?
- @WebFilter在SpringBoot无效的原因分析和解决
- Codeforces Round #222 (Div. 2)
- android AVB2.0(一)工作原理及编译配置
- java计算机毕业设计婚纱影楼服务管理源码+数据库+系统+lw文档+mybatis+运行部署