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


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 相关文章推荐
关闭浏览器时提示onbeforeunload事件
Dec 25 Javascript
Jquery EasyUI中弹出确认对话框以及加载效果示例代码
Feb 13 Javascript
script标签属性用type还是language
Jan 21 Javascript
JavaScript自学笔记(必看篇)
Jun 23 Javascript
javascript深拷贝(deepClone)详解
Aug 24 Javascript
浅谈js中的变量名和函数名重名
Feb 13 Javascript
JavaScript代码判断输入的字符串是否含有特殊字符和表情代码实例
Aug 17 Javascript
AngularJS实现的select二级联动下拉菜单功能示例
Oct 25 Javascript
vue父组件点击触发子组件事件的实例讲解
Feb 08 Javascript
关于ES6箭头函数中的this问题
Feb 27 Javascript
Javascript和jquery在selenium的使用过程
Oct 31 jQuery
JS实现简易留言板增删功能
Feb 08 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
VML绘图板②脚本--VMLgraph.js、XMLtool.js
2006/10/09 PHP
Yii2针对指定url的生成及图片等的引入方法小结
2016/07/18 PHP
thinkPHP2.1自定义标签库的导入方法详解
2016/07/20 PHP
PHP开发中解决并发问题的几种实现方法分析
2017/11/13 PHP
PHP让数组中有相同值的组成新的数组实例
2017/12/31 PHP
javascript数组使用调用方法汇总
2007/12/08 Javascript
jquery 必填项判断表单是否为空的方法
2008/09/14 Javascript
javascript TextArea动态显示剩余字符
2008/10/22 Javascript
jquery zTree异步加载简单实例分享
2013/02/05 Javascript
jquery滚动特效集锦
2015/06/03 Javascript
JavaScript学习笔记--常用的互动方法
2016/12/07 Javascript
HTML页面定时跳转方法解析(2种任选)
2016/12/22 Javascript
详解webpack 入门总结和实践(按需异步加载,css单独打包,生成多个入口文件)
2017/06/20 Javascript
node.js操作MongoDB的实例详解
2017/10/11 Javascript
vue 系列——vue2-webpack2框架搭建踩坑之路
2017/12/22 Javascript
使用vue-router beforEach实现判断用户登录跳转路由筛选功能
2018/06/25 Javascript
微信小程序异步API为Promise简化异步编程的操作方法
2018/08/14 Javascript
详解vue项目中使用token的身份验证的简单实践
2019/03/08 Javascript
Python Web服务器Tornado使用小结
2014/05/06 Python
进一步探究Python中的正则表达式
2015/04/28 Python
Windows中使用wxPython和py2exe开发Python的GUI程序的实例教程
2016/07/11 Python
解决Python 命令行执行脚本时,提示导入的包找不到的问题
2019/01/19 Python
Pycharm配置PyQt5环境的教程
2020/04/02 Python
基于Python3读写INI配置文件过程解析
2020/07/23 Python
HTML5是否真的可以取代Flash
2010/02/10 HTML / CSS
前端实现背景虚化但内容清晰且自适应 的实例代码
2019/08/01 HTML / CSS
英国最大的高品质珠宝和手表专家:Goldsmiths
2017/03/11 全球购物
ellesse美国官方商店:意大利高级运动服品牌
2019/10/29 全球购物
海蓝之谜英国官网:La Mer英国
2020/01/15 全球购物
Delphi工程师笔试题
2013/09/21 面试题
毕业生的自我鉴定该怎么写
2013/12/02 职场文书
食品厂厂长岗位职责
2014/01/30 职场文书
八项规定对照检查材料
2014/08/31 职场文书
2016年5月份红领巾广播稿
2015/12/21 职场文书
护士年终工作总结不会写?各科护士模板总结
2020/01/02 职场文书
vue3如何优雅的实现移动端登录注册模块
2021/03/29 Vue.js