文档章节

jQuery简洁大方的登录页面模板

开源CMS
 开源CMS
发布于 2015/12/10 11:18
字数 497
阅读 119
收藏 0

jQuery+CSS网站登录模板
本模板带验证码

在线体验:http://hovertree.com/texiao/jquery/13.htm

Demo 2:http://hovertree.com/hvtart/bjae/vgte3y3a.htm

Demo 3:http://hovertree.com/hvtart/bjae/dw0f8ytk.htm

以下是HTML文件代码:

<!DOCTYPE html>
<!-- saved from url=(0060)http://hovertree.com/login.php?gotopage=index.php -->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>网站登录模板 - 何问起</title>
<link type="text/css" rel="stylesheet" href="http://hovertree.com/texiao/jquery/13/login.css">
<script type="text/javascript" src="http://hovertree.com/ziyuan/jquery/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="http://hovertree.com/texiao/jquery/13/login.js"></script>
</head>
<body style="overflow:hidden">
<div class="pagewrap">
<div class="main">
<div class="header">
<div style="width:768px;margin:0px auto;">
<a href="http://hovertree.com/hvtart/bjae/jftxwtko.htm">原文</a>
<a href="http://hovertree.com">首页</a> <a href="http://hovertree.com/texiao/">特效</a> <a href="http://hovertree.com/menu/jquery/">jQuery</a> <a href="http://hovertree.com/hvtart/bjae/vgte3y3a.htm">Demo 2</a> <a href="http://hovertree.com/hvtart/bjae/dw0f8ytk.htm">Demo 3</a>
<br />
</div>
</div>
<div class="content">
<div class="con_left"></div>
<div class="con_right">
<div class="con_r_top"><a href="javascript:;" class="left" style="color: rgb(153, 153, 153); border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(222, 222, 222);">扫码直达</a> <a href="javascript:;" class="right" style="color: rgb(51, 51, 51); border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: rgb(46, 85, 142);">登录管理</a></div>
<ul>
<li class="con_r_left" style="display: none;">
<div class="erweima">
<div class="qrcode">
<div id="output" style="width: 100%; position: relative">
<img src="http://hovertree.com/texiao/jquery/13/2weima.png" style="width: 174px; height: 174px">
</div>
</div>
</div>
<div style="height: 70px">
<p>扫码上网 安全便捷</p>
</div>
</li>


<li class="con_r_right" style="display: block;">
<form name="form1" method="post" action="http://tool.hovertree.com/info/ip/" autocomplete="off">
<div class="user">
<div>
<span class="user-icon"></span>
<input type="text" id="userid" name="userid" placeholder=" 输入账号" value="">
</div>

<div>
<span class="mima-icon"></span>
<input type="password" id="pwd" name="pwd" placeholder=" 输入密码" value="">
</div>

<div>
<span class="yzmz-icon"></span>
<input id="vdcode" type="text" name="validate" placeholder=" 验证码" value="" style=" width:150px;">
<!-- 这里是验证码的相关路径,各位站长自行更换 -->

<img style="cursor: pointer; margin-top:8px;" id="imgHoverTreeCode" alt="看不清?点击更换" title="看不清?点击更换" src="http://hovertree.com/texiao/jquery/13/hovertreecheckcode.gif">
</div>

</div><br>
<button id="btn_Login" type="submit">登 录</button>
</form>
</li>
</ul>

</div>

</div>
</div>
</div>

</body>
</html>

更多: http://my.oschina.net/jqtexiao/blog

© 著作权归作者所有

共有 人打赏支持
开源CMS
粉丝 7
博文 3
码字总数 1392
作品 0
东城
高级程序员
初看jQuery,比较dojo与jQuery的不同点

以下观点是建立在我初看jQuery,但并没有对jQuery详细理解的情况下。 可能随着后面对jQuery的使用,而增加更深的了解。也可能发现我当初的观点是错误的。 大体浏览了一下jQuery的文档,发现j...

xpbug
2012/08/18
0
0
收藏几个漂亮的login页面验证

大气带JS表单验证功能的注册页面模板1 http://www.js-css.cn/a/css/template/reglogin/2014/0721/1272.html 大气带JS表单验证功能的登录页面模板2 http://www.js-css.cn/a/css/template/reg...

k_k_anna
2015/03/03
0
0
20篇教你得到酷炫效果的JQuery教程

我们都喜爱jquery带来的梦幻效果。本之列举的教程标题不同,但它们都带有不同的酷炫视觉效果。跟着它们逐步重建你的设计,又或是将这些令人震憾的特效融入你的设计中。 Making a Beautiful H...

晨曦之光
2012/03/09
0
0
Dijit、ExtJS、jQuery UI 异同浅析

简介: 当今,各类 JavaScript 框架在前端开发中已经相当普及。Dojo、Ext jQuery 等主流 JavaScript 框架不仅提供了一系列核心 API 来屏蔽浏览器差异,简化 DOM 操作、增强 JavaScript 原生 ...

索隆
2012/02/21
0
0
【CF 应用开发大赛】新一代在线读书分享:云书

应用名称:云书 应用URL地址:http://cbook.cloudfoundry.com/ 应用说明及使用场景: 图书阅读、评论、分享、收藏、搜索 应用所使用的技术及软件 1、javaee规范 2、后台使用springMVC3.0 3、...

duty
2013/01/21
0
12

没有更多内容

加载失败,请刷新页面

加载更多

下一页

python3.6 取余运算

python中取余运算逻辑如下: 如果a 与d 是整数,d 非零,那么余数 r 满足这样的关系: a = qd + r , q 为整数,且0 ≤ |r| < |d|。 经过测试可发现,python3.6中取余运算得到的 r 是正整数;...

colinux
8分钟前
0
0
[雪峰磁针石博客]软件测试专家工具包1web测试

web测试 本章主要涉及功能测试、自动化测试(参考: 软件自动化测试初学者忠告) 、接口测试(参考:10分钟学会API测试)、跨浏览器测试、可访问性测试和可用性测试的测试工具列表。 安全测试工具...

python测试开发人工智能安全
今天
3
0
JS:异步 - 面试惨案

为什么会写这篇文章,很明显不符合我的性格的东西,原因是前段时间参与了一个面试,对于很多程序员来说,面试时候多么的鸦雀无声,事后心里就有多么的千军万马。去掉最开始毕业干了一年的Jav...

xmqywx
今天
3
0
Win10 64位系统,PHP 扩展 curl插件

执行:1. 拷贝php安装目录下,libeay32.dll、ssleay32.dll 、 libssh2.dll 到 C:\windows\system32 目录。2. 拷贝php/ext目录下, php_curl.dll 到 C:\windows\system32 目录; 3. p...

放飞E梦想O
今天
1
0
谈谈神秘的ES6——(五)解构赋值【对象篇】

上一节课我们了解了有关数组的解构赋值相关内容,这节课,我们接着,来讲讲对象的解构赋值。 解构不仅可以用于数组,还可以用于对象。 let { foo, bar } = { foo: "aaa", bar: "bbb" };fo...

JandenMa
今天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部