仿校内登陆框,精美,给那些很厉害但是没有设计天才的程序员


Posted in Javascript onNovember 24, 2008

改facebook的,绝对是你想要的,不需要图片,因为我的以前几个东西被转载到好多地方但是没有人给我说,还没有人说是哪里来的,就把我blog地址写这里的,要用的话就把那东西去掉吧

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>Beautiful Forms</title> 
<style type="text/css"> 
body{ font-family:宋体, Arial, Helvetica, sans-serif; 
font-size:12px; 
color:#000000; 
} 
a{color:#0033CC;} 
h1, h2, p, form{ 
border:0px; 
margin:0px; 
padding:0px; 
} 
input{ font-family:宋体, Arial, Helvetica, sans-serif; 
font-size:12px; 
} 
h2{ color:#666666; 
margin-bottom:20px; 
font-size:16px; 
} 
div.main{ 
margin:30px auto; 
width:340px; 
} 
div.box{ 
border:solid 1px #c6cfe1; 
background:#dfe4ee; 
padding:10px; 
color:#333333; 
margin-bottom:20px; 
} 
div.box h1 { 
font-size:14px; 
color:#000000; 
padding-bottom:4px; 
} 
div.box p{padding-bottom:14px;} 
div.box input .input-text{ 
border:1px solid #3b6e22; 
color:#666666; 
width:180px; 
} 
div.box label{ 
display:block; 
margin-bottom:10px; 
color:#555555; 
} 
div.box label span{ 
display:block; 
float:left; 
padding-right:6px; 
width:70px; 
text-align:right; 
padding-top:5px; 
font-weight:bold; 
} 
.spacer{margin-left:80px; 
margin-bottom:10px; 
font-size:12px; 
color:#555555; 
} 
.green{ 
background:#67a54b; 
padding:0px 6px; 
border:1px solid #3b6e22; 
height:24px; 
line-height:24px; 
color:#FFFFFF; 
font-size:12px; 
margin-right:10px; 
display:inline-block; 
text-decoration:none; 
} 
</style> 
</head> 
<body> 
<div class="main"> 
<h1>Beautiful Form</h1> 
<h2>Xiaonei inspired</h2> 
For more info visit: <a href="http://blog.csdn.net/webxeyes">http://blog.csdn.net/webxeyes</a> 
<br/><br/> 
<div class="box"> 
<h1>登 陆</h1> 
<p>Do you have an account? Sign in!</p> 
<form action="" method="post"> 
<label><span>账号</span> 
<input type="text"name="email" id="email" class="input-text"/> 
</label> 
<label><span>密码</span> 
<input type="password"name="psw" id="psw" class="input-text"/> 
</label> 
</form> 
<div class="spacer"><a href="#" onClick="" class="green">Sign in</a></div> 
<div class="spacer"> 
忘记密码? <a href="#">找回密码</a><br/> 
还没有注册? <a href="#">注册</a> 
</div> 
</div> 
<div class="box"> 
<h1>Sign Up</h1> 
<p>New User? Create your account now!</p> 
<form action="" method="post"> 
<label><span>Full name</span> 
<input type="text"name="name" id="name" class="input-text"/> 
</label> 
<label><span>E-mail</span> 
<input type="text"name="email" id="email" class="input-text"/> 
</label> 
<label><span>Password</span> 
<input "psw" type="password" id="psw" class="input-text"/> 
</label> 
</form> 
<div class="spacer"><a href="#" onClick="" class="green">Create Account</a></div> 
<div class="spacer"> 
忘记密码? <a href="#">找回密码</a><br/> 
还没有注册? <a href="#">注册</a> 
</div> 
</div> 
<div class="box"> 
<h1>Sign Up</h1> 
<p>New User? Create your account now!</p> 
<form action="" method="post"> 
<label><span>Full name</span> 
<input type="text"name="name" id="name" class="input-text"/> 
</label> 
<label><span>E-mail</span> 
<input type="text"name="email" id="email" class="input-text"/> 
</label> 
<label><span>Password</span> 
<input "psw" type="password" id="psw" class="input-text"/> 
</label> 
</form> 
<div class="spacer"><input type=submit onClick="" class="green">Create Account</a></div> 
<div class="spacer"> 
忘记密码? <a href="#">找回密码</a><br/> 
还没有注册? <a href="#">注册</a> 
</div> 
</div> 
</div> 
</body> 
</html>
Javascript 相关文章推荐
用javascript实现兼容IE7的类库 IE7_0_9.zip提供下载
Aug 08 Javascript
jQuery timers计时器简单应用说明
Oct 28 Javascript
javascript showModalDialog 内跳转页面的问题
Nov 25 Javascript
正则表达式搭配js轻松处理json文本方便而老古
Feb 17 Javascript
getComputedStyle与currentStyle获取样式(style/class)
Mar 19 Javascript
jquery购物车实时结算特效实现思路
Sep 23 Javascript
解决Extjs4中form表单提交后无法进入success函数问题
Nov 26 Javascript
跟我学习javascript的函数和函数表达式
Nov 16 Javascript
jQuery实现分页功能(含ajax请求、后台数据、附完整demo)
Apr 03 jQuery
vue中使用axios post上传头像/图片并实时显示到页面的方法
Sep 27 Javascript
js图数据结构处理 迪杰斯特拉算法代码实例
Sep 11 Javascript
jquery 回调操作实例分析【回调成功与回调失败的情况】
Sep 27 jQuery
javascript 贪吃蛇实现代码
Nov 22 #Javascript
js利用div背景,做一个竖线的效果。
Nov 22 #Javascript
JavaScript使用技巧精萃[代码非常实用]
Nov 21 #Javascript
FireFox与IE 下js兼容触发click事件的代码
Nov 20 #Javascript
js刷新框架子页面的七种方法代码
Nov 20 #Javascript
拖拉表格的JS函数
Nov 20 #Javascript
设置下载不需要倒计时cookie(倒计时代码)
Nov 19 #Javascript
You might like
全国FM电台频率大全 - 3 河北省
2020/03/11 无线电
function.inc.php超越php
2006/12/09 PHP
Session的工作机制详解和安全性问题(PHP实例讲解)
2014/04/10 PHP
php正则表达式获取内容所有链接
2015/07/24 PHP
使用Appcan客户端自动更新PHP版本号(全)
2015/07/31 PHP
CentOS7系统搭建LAMP及更新PHP版本操作详解
2020/03/26 PHP
火狐4、谷歌12不支持Jquery Validator的解决方法分享
2011/06/20 Javascript
node.js中的path.resolve方法使用说明
2014/12/08 Javascript
JS实现浏览器状态栏文字闪烁效果的方法
2015/10/27 Javascript
简单的JS时钟实例讲解
2016/01/13 Javascript
jquery实现简单的banner轮播效果【实例】
2016/03/30 Javascript
JavaScript关于提高网站性能的几点建议(一)
2016/07/24 Javascript
js变量提升深入理解
2016/09/16 Javascript
JavaScript中绑定事件的三种方式及去除绑定
2016/11/05 Javascript
走进javascript——不起眼的基础,值和分号
2017/02/24 Javascript
VueJS事件处理器v-on的使用方法
2017/09/27 Javascript
js prototype深入理解及应用实例分析
2019/11/25 Javascript
JavaScript实现10秒后再次获取验证码
2020/12/02 Javascript
[35:29]Secret vs VG 2018国际邀请赛淘汰赛BO3 第三场 8.23
2018/08/24 DOTA
python 实现归并排序算法
2012/06/05 Python
如何运行Python程序的方法
2013/04/21 Python
Python使用PyGreSQL操作PostgreSQL数据库教程
2014/07/30 Python
Python使用Scrapy保存控制台信息到文本解析
2017/12/27 Python
django主动抛出403异常的方法详解
2019/01/04 Python
Python实现RabbitMQ6种消息模型的示例代码
2020/03/30 Python
python数据分析工具之 matplotlib详解
2020/04/09 Python
品恩科技软件测试面试题
2014/10/26 面试题
商铺租赁意向书
2014/04/01 职场文书
我的画教学反思
2014/04/28 职场文书
应届生自荐信
2014/06/30 职场文书
医生辞职信范文
2015/03/02 职场文书
运动会开幕式主持词
2015/07/01 职场文书
公司考勤管理制度
2015/08/04 职场文书
教师外出学习心得体会
2016/01/18 职场文书
解决pycharm下载库时出现Failed to install package的问题
2021/09/04 Python
CSS实现鼠标悬浮动画特效
2023/05/07 HTML / CSS