内容描述
- 依照设计图对登录页面完成基本设计
登录页面
登录，进入系统
依照设计图修改部分菜单页面
菜单页面部分内容
参考设计图
登录界面
菜单界面
代码
（约250行）
- 登录界面
点击查看代码
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!--
功能介绍：系统登录界面
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>公文传输系统</title>
<style type="text/css">
<!-- body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
-->
</style>
<link href="css/css.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function commit() {
if (form1.username.value == "") {
alert("请您输入用户名！");
form1.username.focus();
return false;
}
if (form1.password.value == "") {
alert("请您输入密码！");
form1.password.focus();
return false;
}
return true;
}
</script>
</head>
<body>
<form action="files/login/check_login.jsp" method="post" name="form1" onsubmit="return commit()">
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="width: 1371px;">
<tr>
<td height="147" background="images/top02.gif" width="160%"><img src="images/topper.png" width="160%" /></td>
</tr>
</table>
<center>
<fieldset style="width:562px;height:450px;align=center">
<table width="900" border="0" align="center" cellpadding="0" cellspacing="0" class="right-table03">
<tr>
<td width="540">
<table width="95%" border="0" cellpadding="0" cellspacing="0" class="login-text01">
<tr>
<td>
<table width="100%" border="0" cellpadding="0" cellspacing="0" class="login-text01">
<tr>
<td align="center"><img src="./images/gwcsxt.png" width="428" height="388" /></td>
<td height="40" align="center"> </td>
</tr>
</table>
</td>
<td><img src="images/line01.png" width="2" height="1587" style="width: 2px; height: 450px;"/></td><!--可删除，如果可以解决布局问题可以更改-->
</tr>
</table>
</td>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="31%" height="35" class="login-text02"><!--改这里--><img src="images/login.png" width="24" height="24"> <br /></td>
<td width="69%"><input name="username" id="username" type="text" size="28" style="width:150px" /></td>
</tr>
<tr>
<td height="35" class="login-text02"><!--改这里--><img src="images/loginps.png" width="24" height="24"> <br /></td>
<td><input name="password" id="password" type="password" size="30" style="width:150px" /></td>
</tr>
<tr>
<td height="35" class="login-text02"><img src="images/sfh.png" width="24" height="24"> <br /></td>
<td>
<select name="role">
<option value="2">职 员</option>
<option value="0">管理员</option>
<option value="1">单 位</option>
</select>
</td>
</tr>
<tr>
<td height="35"> </td>
<td><input name="Submit2" type="submit" class="right-button02" value="登 录" style="background-image: url(images/button14.gif);"/>
<input name="reset232" type="reset"" class=" right-button02" value="重 置" style="background-image: url(images/button24.gif);"/></td>
</tr>
<%
if("0".equals(request.getParameter("info"))){ %>
<font color="red">密码错误，请重新填写！</font>
<%}else if("1".equals(request.getParameter("info"))){ %>
<font color="red">账号不存在，请重新填写！</font>
<%}%>
</table>
</td>
</tr>
</table>
</fieldset>
</center>
</form>
</body>
</html>
- 菜单栏部分代码
点击查看代码
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!--
功能介绍：系统页面框架
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>公文传输系统</title>
</head>
<%@ include file="files/db/conn.jsp"%>
<frameset rows="59,*" cols="*" frameborder="no" border="0" framespacing="0">
<frame src="files/top.html" name="topFrame" scrolling="no" noresize="noresize" id="topFrame" title="topFrame" />
<frameset cols="213,*" frameborder="no" border="0" framespacing="0">
<frame src="files/left.jsp" name="leftFrame" scrolling="no" noresize="noresize" id="leftFrame" title="leftFrame" />
<frame src="files/mainfra.html" name="mainFrame" id="mainFrame" title="mainFrame" />
</frameset>
</frameset>
<noframes>
<body>
</body>
</noframes>
</html>
点击查看代码
<!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" />
<title>公文传输系统</title>
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
-->
</style>
<link href="../css/css.css" rel="stylesheet" type="text/css" />
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="59"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr background="../images/loop.png">
<center><img src="../images/logo.png" height="59" border="0" /></center>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
点击查看代码
<!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" />
<title>公文传输系统</title>
<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 1px;
margin-right: 0px;
margin-bottom: 0px;
}
html { overflow-x: ; overflow-y: ; border:0;}
-->
</style>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#4AA3D8"></td>
</tr>
<tr>
<td><table width="768" height="500" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="top"><img src="../images/welcome.gif" width="768" height="570" /></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>