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


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 相关文章推荐
从数据结构分析看:用for each...in 比 for...in 要快些
Apr 17 Javascript
在JavaScript中使用NaN值的方法
Jun 05 Javascript
JS+CSS实现的日本门户网站经典选项卡导航效果
Sep 27 Javascript
jQuery移动端日期(datedropper)和时间(timedropper)选择器附源码下载
Apr 19 Javascript
Node.js刷新session过期时间的实现方法推荐
May 18 Javascript
AngularJS指令详解及示例代码
Aug 16 Javascript
浅谈在js传递参数中含加号(+)的处理方式
Oct 11 Javascript
JQuery页面随滚动条动态加载效果的简单实现(推荐)
Feb 08 Javascript
Node中使用ES6语法的基础教程
Jan 05 Javascript
Vue混入mixins滚动触底的方法
Nov 22 Javascript
使用Bootstrap做一个朝代历史表
Dec 10 Javascript
Vue微信公众号网页分享的示例代码
May 28 Javascript
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
php 判断是否是中文/英文/数字示例代码
2013/09/30 PHP
php三维数组去重(示例代码)
2013/11/26 PHP
WordPress的主题编写中获取头部模板和底部模板
2015/12/28 PHP
PHP登录(ajax提交数据和后台校验)实例分享
2016/12/29 PHP
基于JQuery 的消息提示框效果代码
2011/07/31 Javascript
在服务端(Page.Write)调用自定义的JS方法详解
2013/08/09 Javascript
js 时间格式与时间戳的相互转换示例代码
2013/12/25 Javascript
jQuery选择器简明总结(含用法实例,一目了然)
2014/04/25 Javascript
javascript RegExp 使用说明
2016/05/21 Javascript
vue实现ajax滚动下拉加载,同时具有loading效果(推荐)
2017/01/11 Javascript
基于jQuery的左滑出现删除按钮的示例
2017/08/29 jQuery
如何快速解决JS或Jquery ajax异步跨域的问题
2018/01/08 jQuery
基于Vue-Cli 打包自动生成/抽离相关配置文件的实现方法
2018/12/09 Javascript
微信小程序可滑动周日历组件使用详解
2019/10/21 Javascript
vue 动态生成拓扑图的示例
2021/01/03 Vue.js
Linux-ubuntu16.04 Python3.5配置OpenCV3.2的方法
2018/04/02 Python
对Python2与Python3中__bool__方法的差异详解
2018/11/01 Python
python url 参数修改方法
2018/12/26 Python
Python Django 实现简单注册功能过程详解
2019/07/29 Python
python文字和unicode/ascll相互转换函数及简单加密解密实现代码
2019/08/12 Python
Windows下pycharm创建Django 项目(虚拟环境)过程解析
2019/09/16 Python
Python 转换RGB颜色值的示例代码
2019/10/13 Python
基于python实现把json数据转换成Excel表格
2020/05/07 Python
pycharm设置默认的UTF-8编码模式的方法详解
2020/06/01 Python
在pycharm中使用matplotlib.pyplot 绘图时报错的解决
2020/06/01 Python
2021年值得向Python开发者推荐的VS Code扩展插件
2021/01/25 Python
美国领先的机场停车聚合商:Airport Parking Reservations
2020/02/28 全球购物
经典的班主任推荐信
2013/10/28 职场文书
母亲七十大寿答谢词
2014/01/18 职场文书
学校安全检查制度
2014/01/27 职场文书
高中生的自我评价
2014/03/04 职场文书
5.12护士节演讲稿
2014/04/30 职场文书
计算机专业求职信
2014/06/02 职场文书
实验心得体会
2014/09/05 职场文书
团代会邀请函
2015/02/02 职场文书
明星邀请函
2015/02/02 职场文书