哈哈！今天把登录页面完成了，本来按照我以前的概念做网页是要用到画表格来实现的，整个网页就是一个大的表格，每一部分就是网表格里填入的数据、文字或是图片。今天终于知道了原来进入WEB2.0时代后人们都是用DIV+CSS来做网页了。
利用DIV+CSS可以不借助任何图形化的网页绘制工具，而只是用基本的编辑器就可以做出漂亮的网页来，真是很神奇啊！
我也采用这个方法做出了自己的登录页面
自己还挺满意的呢，借用了微软WINDOWS LIVE网站的图片，呵呵 因为自己的美工不好，画不出好图来呢
https://static.assets-stash.eet-china.com/album/old-resources/2009/9/16/9bf51d73-c62b-461b-a96c-8111a63574c6.rar
<!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="utf-8"" />
<script src="Script/check.js" type="text/javascript" charset="GBK"></script>
<script src="Script/md5.js" type="text/javascript" charset='UTF-8'></script>
<title>TL智能家居管理平台2009</title>
<style type="text/css">
<!--
label {
font-family: "Comic Sans MS", cursive, "微软雅黑";
font-size: 16px;
font-style: normal;
cursor: auto;
}
.header {
width: 1024px;
font-family: "Comic Sans MS", cursive, "微软雅黑";
font-size: 40px;
font-weight: normal;
text-align: center;
}
.login_button {
BORDER-RIGHT: #7b9ebd 1px solid;
PADDING-RIGHT: 2px;
BORDER-TOP: #7b9ebd 1px solid;
PADDING-LEFT: 2px;
FONT-SIZE: 12px;
FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr="#ffffff", EndColorStr="#cecfde"); BORDER-LEFT: #7b9ebd 1px solid;
CURSOR: hand;
COLOR: black;
PADDING-TOP: 2px;
BORDER-BOTTOM: #7b9ebd 1px solid;
margin: 10px;
}
.login_button_div {
width: 1024px;
text-align:center;
display: block;
clear: both;
float: left;
}
#form1 {
width: 1024px;
text-align: center;
display: block;
float: none;
}
.top {
background-image: url(image/top.jpg);
background-repeat: repeat-x;
background-position: center center;
display: block;
width: auto;
visibility: visible;
}
#hole_page {
clear: both;
height: 600px;
width: 1024px;
overflow: hidden;
}
-->
</style>
</head>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset="utf-8"" />
<script src="Script/check.js" type="text/javascript" charset="GBK"></script>
<script src="Script/md5.js" type="text/javascript" charset='UTF-8'></script>
<title>TL智能家居管理平台2009</title>
<style type="text/css">
<!--
label {
font-family: "Comic Sans MS", cursive, "微软雅黑";
font-size: 16px;
font-style: normal;
cursor: auto;
}
.header {
width: 1024px;
font-family: "Comic Sans MS", cursive, "微软雅黑";
font-size: 40px;
font-weight: normal;
text-align: center;
}
.login_button {
BORDER-RIGHT: #7b9ebd 1px solid;
PADDING-RIGHT: 2px;
BORDER-TOP: #7b9ebd 1px solid;
PADDING-LEFT: 2px;
FONT-SIZE: 12px;
FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr="#ffffff", EndColorStr="#cecfde"); BORDER-LEFT: #7b9ebd 1px solid;
CURSOR: hand;
COLOR: black;
PADDING-TOP: 2px;
BORDER-BOTTOM: #7b9ebd 1px solid;
margin: 10px;
}
.login_button_div {
width: 1024px;
text-align:center;
display: block;
clear: both;
float: left;
}
#form1 {
width: 1024px;
text-align: center;
display: block;
float: none;
}
.top {
background-image: url(image/top.jpg);
background-repeat: repeat-x;
background-position: center center;
display: block;
width: auto;
visibility: visible;
}
#hole_page {
clear: both;
height: 600px;
width: 1024px;
overflow: hidden;
}
-->
</style>
</head>
<body>
<div id="hole_page">
<img src="image/top.jpg" width="1800" height="86" />
<div class="header">
<p>欢迎光临智能家居管理平台</p>
</div>
<form id="form1" name="form1" method="post" action="/cgi-bin/login.cgi">
<p>
<label for="user_name">用户名：</label>
<input name="user_name" type="text" id="user_name" maxlength="50" />
</p>
<p>
<label for="passwd">密 码：</label>
<input name="passwd" type="password" id="passwd" maxlength="20" />
</p>
<div class="login_button_div">
<p>
<input type="submit" name="submit" id="submit" class="login_button" value="提交"/>
<input type="reset" name="abord" id="abord3" class="login_button" value="重置"/>
</p>
</div>
<p> </p>
</form>
<p> </p>
</div>
</body>
</html>
<div id="hole_page">
<img src="image/top.jpg" width="1800" height="86" />
<div class="header">
<p>欢迎光临智能家居管理平台</p>
</div>
<form id="form1" name="form1" method="post" action="/cgi-bin/login.cgi">
<p>
<label for="user_name">用户名：</label>
<input name="user_name" type="text" id="user_name" maxlength="50" />
</p>
<p>
<label for="passwd">密 码：</label>
<input name="passwd" type="password" id="passwd" maxlength="20" />
</p>
<div class="login_button_div">
<p>
<input type="submit" name="submit" id="submit" class="login_button" value="提交"/>
<input type="reset" name="abord" id="abord3" class="login_button" value="重置"/>
</p>
</div>
<p> </p>
</form>
<p> </p>
</div>
</body>
</html>
呵呵
感觉还可以把
EE直播间
更多
-
提升毫米波信号测试精度 直播时间： 12月18日 14:00 -
EE Talk主题专访系列直播-对话：释放 Wi-Fi 7 在高带宽应用中的技术潜力 直播时间： 12月19日 10:00
关闭
站长推荐
/2 
/2
文章评论（0条评论）
登录后参与讨论