`
modabobo
  • 浏览: 509438 次
文章分类
社区版块
存档分类
最新评论

我的博客网站设计

 
阅读更多

Jsp页面以及css,ja

css

editblog

@charset "utf-8";
/* CSS Document */

body{
	margin:0px;
	padding:0px;
}
div{
	margin-left:20px;
	margin-top:20px;
}
body{
	background-image:url(../images/enitarticalbg.jpg);
	background-repeat:repeat-y;
}
#editblog{
	width:800px;
	margin:100px auto 200px;
	background-color:#CCC;
}
#title input,#type input{
	width:70%;
}
#submit input{
	margin-left:300px;
	height:40px;
	background-color:#C2E6EA;
	font-size:24px;
}

head.css

@charset "utf-8";
/* CSS Document */
body{
	margin:0px;
	padding:0px;
	
}
#head{
	width:100%;
	height:300px;
	background-image:url(../images/indexbg.jpg);
	background-repeat:no-repeat;
}
a{
	color:#666;
	text-decoration:none;
}
.list{
	display:inline;

}
#name{
	border:1px solid #888;
	font-family: "宋体";
	font-size: 32px;
	color: #333;
	
}
#loginandregiest{
	width:700px;
	margin:50px 500px  0px;;
}
#showname{
	width:500px;
	margin:50px 500px  0px;;
}
#blog_a{
	width:600px;
	margin-top:150px;
	margin-left:500px;
}

masterblog

@charset "utf-8";
/* CSS Document */

body{
			background-color:#E2E2E2;
	}
	#center{
		width:800px;
		margin:0px auto 0px;
		min-height:500px;
	}
	#left{

		width:180px;
		margin:20px auto 10px;
		float:left;
	}
	#right{
		background-color:#FEFEFE;
		width:600px;
		margin:20px auto 10px;
		min-height:400px;
		float:right;
	}
	#friend{
		width:170px;
		margin:0px auto 10px;
		border:1px dotted #c3c3c3;
		background-color:#FEFEFE;
	}
	#word{
		width:170px;
		margin:0px auto 10px;
		border:1px dotted #c3c3c3;
	}
	.index{
		background-color:#F5F6F5;
		width:170px;
		display:block;
	}
	.index1{
		background-color:#F5F6F5;
		width:600px;
		display:block;
	}
	.index2{
		background-color:#F5F6F5;
		width:800px;
		display:block;
	}
	.adt{
	display: inline;
	}
	.title{
		font-family: "宋体";
		font-size: 24px;
		color: #919191;
		text-align: center;
	}
	.entity
	{
		border-bottom: 2px dotted #666;
		margin-top: 10px;
	}
	.ainfo{
		font-size: 18px;
		color: #606090;
		margin-left: 20px;
	}
	.aother{
	color:#666;
	margin-left: 300px;
	}
	.content{
		font-size: 16px;
		color: #444;
		margin-left: 20px;
	}
	#search{
	width: 60px;
	}
	#word{
	background-color:#FEFEFE;
	}
	#findfriend{
	background-color:#FEFEFE;
	width:170px;
	margin:0px auto 10px;
	}
	.frienddt{
	background-color: #ccc;
	border-bottom: 2px solid #fff;
	}
	#friendmessage{
	color: red;
	}
	.frienddd{
	color:#096;
	}
	#picture{
		width:800px;
		margin:0px auto 0px;
		min-height:100px;
		background-color:#FEFEFE;
	}
	img{
	width: 200px;
	height: 130px;
	}
	.photo{
	display: inline;
	}
	#worddl,#frienddl{
   margin: 0px;
   }
   .frienda
   {
   		display: block;
   		padding-left: 50px;
   		color: #519f22;
   }
   .frienda:HOVER {
	border-color: #008;
}


regiest

@charset "utf-8";
/* CSS Document */

body,form{
	margin:0px;
	padding:0px;

}
body{
	background-image:url(../images/enitarticalbg.jpg);
}
form{
	background-color:#CCC;
	width:50%;
	margin:50px auto 100px;
}
td{
	width:50%;
}
th{
	text-align:center;
	font-size:24px;
}
.c1{
	font-size:18px;
	text-align:right;
	padding-right:50px;
}
#i1{
	text-align:center;
	font-size:18px;
}
#i2{
	font-size:12px;
	color:#666;
}
.error{
	background-color: red;
}
	
	

js

regiest

// JavaScript Document
$(document).ready(function()
{
	$("#username").focusout(function(){
		$.get("http://localhost:8080/UnShop/servlet/Login",$("username".val()),function(response)
				{
					$("#html").html(response);
			
				});
			
		//$("#name").html("用户名已经存在").css("color","red");
		
	});
	$("#repassword").focusout(function()
	{
		if($("#password").val()!=$("#repassword").val())
		{
			$("#repass").html("两次密码输入不一致").css("color","red");
		}
		else
		{
			$("#repass").html("");
		}
	});
})

jsp

editblog

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link type="text/css" href="../css/editartical.css"  rel="stylesheet"/>

	<title>无标题文档</title>
</head>
	<body>
	    <div id="editblog">
	    	<form action="${pageContext.request.contextPath }/servlet/ArticalForm" method="post">
	    		<div id="title">文章标题:<input type="text" name="title" value="${artical.title }"/></div>
	    		<div class="error">${articalerror.title }</div>
	    		<div id="comefrom">文章来源:<input type="text" name="comefrom" value="${artical.comeform }"/></div>
	    		<div class="error">${articalerror.comeform }</div>
	            <div >	
	            	文章类型:    		
		            <c:forEach var="at" items="${type }" >
		    			<input type="radio" name="articalType" value="${at.name }"/>${at.name }
		    		</c:forEach>
		    		<div class="error">${typeerror }</div>
	    		</div>
	    		<div id="info">
	                <dl>
	                	<dt>文章简介</dt>
	                    <dt><textarea cols="80"  name="info" rows="5" >${artical.info }</textarea></dt>
	                </dl>
	                <div class="error">${articalerror.info}</div>
	            </div>
	            <div id="content">
	            	<dl>
	                    <dt><textarea cols="80" id="content" name="content" rows="10">${artical.content }</textarea></dt>
	                </dl>
	                  <div class="error">${articalerror.content}</div>
	            </div>
	            <div id="submit"><input type="hidden" name="id" value="${artical.id }"/><input type="submit"  value="发表博文"/></div>
	        </form>
	    </div>
	</body>
</html>

friendartical

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    
    <title>好友文章</title>
    <style type="text/css">
    	body{
			background-color:#E2E2E2;
	}
	#center{
		background-color:#FEFEFE;
		width:700px;
		margin:20px auto 10px;
		min-height:100px;
	}

	.index1{
		background-color:#F5F6F5;
		width:700px;
		display:block;
	}
	.title{
		font-family: "宋体";
		font-size: 24px;
		color: #919191;
		text-align: center;
	}
	.entity
	{
		margin-top: 10px;
	}
	.ainfo{
		font-size: 18px;
		color: #606090;
		margin-left: 20px;
	}
	.aother{
	color:#666;
	margin-left: 400px;
	}
	.adt{
	display: inline;
	}
	.content{
		font-size: 16px;
		color: #444;
		margin-left: 20px;
	}
	.rword{
	color: #62f3c4;
	font-family: "宋体";
	font-size: 22;
	
	}
	#word{
	display: none;
	}
	#showword{
	min-height: 100px;
	background-color: #efefef;
	}
	.masternames{
		margin-left: 100px;
		color: gray;
	}
	.wordcontent{
		margin-left: 100px;
		color:#667865;
	}
    </style>
  <script type="text/javascript" src="../js/jquery.js"></script>
  <script type="text/javascript">
  $(document).ready(function(){
  
  	$("#giveword").click(function()
  	{
  		$("#word").slideToggle();
  	});
  	$("#upword").click(function(){
  		$.get("${pageContext.request.contextPath }/servlet/WordForm",{content: encodeURI($("#content").val()),id:$("#id").val()},function(response){
  		$("<dd></dd>").html(response).appendTo($("#showresponse"));
  		});
  	});
  	$("#blog").click(function()
  	{
  		$("#everyartical").slideToggle();
  	});
  });
  </script>


  </head>
  <body>
    <jsp:include page="/page/head.jsp"></jsp:include>
     <div id="center">
    	<div  id="artical">
        	<div class="index1" id="blog">博文</div>
        	<div class="entity" id="everyartical">
        		<div class="title">${artical.title }</div>
        		<div class="ainfo">简介:${artical.info }</div>
        		<div class="content"><span>${artical.content }</span></div>
        		<div class="aother">
        			<dt class="adt">阅读量[${artical.count }]	</dt>
        			<c:choose>
        				<c:when test="${empty master }">
        					<dt class="adt"><a href="#"  class="rword">请登录后评论</a></dt>
        				</c:when>
        				<c:otherwise>
        					<dt class="adt"><a href="#" id="giveword" class="rword">评论</a></dt>
        				</c:otherwise>
        			</c:choose>
        			
        		</div>
        	</div>
        </div>
        <div id="showword">
         <div class="index1">内容评论</div>
         <dl id="showresponse">
         	<c:forEach items="${listword }" var="word">
         		<dd><div calss="masternames">${word.master.name } :</div>
         			<div class="wordcontent">${word.content }</div> </dd>
         	</c:forEach>
         </dl> 
        </div>
        <div id="word">
	        <div class="index1">我要评论</div>
	        	<textarea rows="5" cols="80" name="content" id="content"></textarea>
	        	<input type="hidden" id="id" value="${artical.id }"/>
	        	<div  class="aother"><input type="button" value="提交评论" id="upword"/>
	        </div>
	    </div>
    </div>
    <jsp:include page="/page/root.jsp" ></jsp:include>
  </body>
</html>

friendblog

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!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>
  <link rel="stylesheet" href="../css/masterblog.css" />
   <style >
   		#information{
   		margin: 0px;
   		}
   		.frienddt{
   		height: 50px;
   		padding-left: 10px;
   		padding-top:18px;
   		color: blue;
   		background-color: ddd;
   		}
   </style>
   <script type="text/javascript" src="../js/jquery.js"></script>
  <script type="text/javascript">
  $(document).ready(function(){
  
  	$("#blogartical").click(function()
  	{
  		$("#everyartical").slideToggle();
  	});
  	$("#blogphoto").click(function()
  	{
  		$("#everyphoto").slideToggle();
  	});
  });
  </script>
   
  </head>
  
  <body>
 <jsp:include page="/page/head.jsp"></jsp:include>
<div id="center">
	<div id="left">
    	<div id="friend">
    		<div id="blogmaster">
	        	<dl id="information" >
	        		<dt class="index">博主简介</dt>
	        		<dt class="frienddt">博主姓名:${friendmaster.name }</dt>
	        		<dt class="frienddt">博主性别:${friendmaster.sex }</dt>
	        		<dt class="frienddt">博主QICQ:${friendmaster.QICQ }</dt>
	        	</dl>
        	</div>
		</div>
    </div>
    <div id="right">
    	<div  id="artical">
        	<div class="index1" id="blogartical">博文</div>
        	<div id="everyartical">
        	<c:forEach items="${articallist }" var="artical">
        	<div class="entity" >
        		<div class="title">${artical.title }</div>
        		<div class="ainfo">简介:${artical.info }</div>
        		<div class="content"><span>${artical.content }</span></div>
        		<div class="aother">
        			<dt class="adt">阅读量[${artical.count }] </dt>
        			<dt class="adt"><a href="${pageContext.request.contextPath }/servlet/ShowFriendArtical?id=${artical.id }">评论</a> </dt>
        			<dt class="adt"><a href="${pageContext.request.contextPath }/servlet/ShowFriendArtical?id=${artical.id }">查看全文</a></dt>
        		</div>
        	</div>
        	</c:forEach>
        	</div>
        </div>
    </div>
</div>
<div id="picture">
	<div class="index2" id="blogphoto">博主相册</div>
	<div id="everyphoto">
		<c:forEach items="${photolist }" var="photo">
			<dd class="photo"><img src="${pageContext.request.contextPath }/${photo.pathname }" alt="${photo.name } "/></dd>
		</c:forEach>
	</div>
</div>
<jsp:include page="/page/root.jsp" ></jsp:include>
</body>
</html>

head

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<link type="text/css" rel="stylesheet" href="../css/head.css" />
<div id="head">
<div>~~~~~~~~~~~~~~~</div>
<c:choose>
	<c:when test="${empty master }">
    <div id="loginandregiest">
    <form action="${pageContext.request.contextPath }/servlet/LoginForm" method="post">
    	<dl>
    		
	    		<dt class="list">用户名<input type="text" name="name"/></dt>
	    		<dt class="list">密码<input type="text" name="password"/></dt>
	        	<dt class="list"><input type="submit" value="登入"/></dt>
	        	<dt class="list"><a href="${pageContext.request.contextPath }/page/regiest.jsp">注册</a></dt>     
        </dl>
      </form>
    </div>
    </c:when>
    <c:otherwise>
    <dl id="showname">
    <dt class="list" id="name">${master.name }</dt>
   	<dt class="list"> <a href="${pageContext.request.contextPath }/servlet/CencalMaster">注销</a></dt>
   	</dl>
   	 <div id="blog_a">
        <dl>
            <dt class="list"><a href="${pageContext.request.contextPath }/servlet/ShowIndex">首页</a></dt>
            <dt class="list"><a href="${pageContext.request.contextPath }/servlet/MasterBlog">我的博客</a></dt>
            <dd class="list"><a href="${pageContext.request.contextPath }/servlet/ListArtical">博文目录</a></dd>
            <dd class="list"><a href="${pageContext.request.contextPath }/servlet/ShowPhoto">我的相册</a></dd>
            <dd class="list"><a href="${pageContext.request.contextPath }/page/photoupload.jsp">上传照片</a></dd>
            <dd class="list"><a href="${pageContext.request.contextPath }/servlet/ShowArtical">写博文</a></dd>
        </dl>
    </div>
    </c:otherwise>
   </c:choose>
   
</div>


index

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <style type="text/css">
  
  body{
			background-color:#E2E2E2;
	}
	#center{
		width:800px;
		margin:0px auto 0px;
		min-height:500px;
	}
	#left{

		width:180px;
		margin:20px auto 10px;
		float:left;
		padding: 0px;
	}
	#right{
		background-color:#FEFEFE;
		width:600px;
		margin:20px auto 10px;
		min-height:100px;
		float:right;
	}
	#friend{
		width:170px;
		background-color:#FEFEFE;
		min-height: 150px;
	}
	.index{
		background-color:#F5F6F5;
		width:170px;
		display:block;
	}
	.index1{
		background-color:#F5F6F5;
		width:600px;
		display:block;
	}
	.adt{
	display: inline;
	}
	.title{
		font-family: "宋体";
		font-size: 24px;
		color: #919191;
		text-align: center;
	}
	.entity
	{
		border-bottom: 2px dotted #666;
		margin-top: 10px;
	}
	.ainfo{
		font-size: 18px;
		color: #606090;
		margin-left: 20px;
	}
	.aother{
	color:#666;
	margin-left: 300px;
	}
	.content{
		font-size: 16px;
		color: #444;
		margin-left: 20px;
	}
   dl{
   margin: 0px;
   }
   	.frienddt{
	background-color: #ccc;
	border-bottom: 2px solid #fff;
	}
   .frienda
   {
   		display: block;
   		padding-left: 50px;
   		color: #519f22;
   }
   #frienddl dt a:HOVER {
	border-color: #008;
}

  
  
  </style>
     <script type="text/javascript" src="../js/jquery.js"></script>
  <script type="text/javascript">
  $(document).ready(function(){
  
  	$("#blogartical").click(function()
  	{
  		$("#everyartical").slideToggle();
  	});
  	$("#bastmaster").click(function()
  	{
  		$("#frienddl").slideToggle();
  	});
  });
  </script>

  </head>
  
  <body>
  <jsp:include page="/page/head.jsp"></jsp:include>
  <div id="center">
	<div id="left">
    	<div id="friend">
    		<div class="index" id="bastmaster">优秀博主</div>
        	<dl id="frienddl" >
        	
        		<c:forEach items="${friendlist }" var="friend">
        			<dt class="frienddt"><a href="${pageContext.request.contextPath }/servlet/ShowFriendBlog?id=${friend.QICQ }" class="frienda">${friend.name }</a></dt>
        		</c:forEach>
        		
        	</dl>
		</div>
    </div>
    <div id="right">
    	<div  id="artical">
        	<div class="index1" id="blogartical">精彩博文</div>
        	<div id="everyartical">
        	<c:forEach items="${articallist }" var="artical">
        	<div class="entity">
        		<div class="title">${artical.title }</div>
        		<div class="ainfo">简介:${artical.info }</div>
        		<div class="aother">
        			<dt class="adt">阅读量[${artical.count }] </dt>
        			<dt class="adt"><a href="${pageContext.request.contextPath }/servlet/ShowFriendArtical?id=${artical.id }">评论</a> </dt>
        			<dt class="adt"><a href="${pageContext.request.contextPath }/servlet/ShowFriendArtical?id=${artical.id }">查看全文</a></dt>
        		</div>
        	</div>
        	</c:forEach>
        	</div>
        </div>
        <jsp:include page="/page/root.jsp" ></jsp:include>
    </div>
</div>

  </body>
</html>

listblog

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!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>
body{
	background-color:#E2E2E2;
}
#center{
	width:800px;
	margin-left: 500px;
}
td{
	width:120px;
}
</style>
</head>

<body>
<jsp:include page="/page/head.jsp"></jsp:include>
<div id="center">
	<table>
    	<thead>
        	<tr>
            	<td><h3>博文ID</h3></td><td><h3>博文标题</h3></td><td ><h3>博文简介</h3></td><td><h3>编辑</h3></td><h3></td><td><h3>删除</h3></td>
            </tr>
        </thead>
        <tbody>
        	<c:forEach items="${articallist }" var="artical">
        	<tr><td>${artical.id }</td><td>${artical.title }</td><td>${artical.info }</td><td><a href="${pageContext.request.contextPath }/servlet/ReEditBlog?id=${artical.id }">修改</a></td><td><a href="${pageContext.request.contextPath }/servlet/DeleteArtical?id=${artical.id }">删除</a></td></tr>	
        	</c:forEach>
        </tbody>
    </table>
</div>
<jsp:include page="/page/root.jsp" ></jsp:include>
</body>
</html>


masterblog

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!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 type="text/javascript" src="../js/jquery.js"></script>
<link rel="stylesheet" href="../css/masterblog.css" />
<title>博客</title>
<script >
	$(document).ready(function()
	{
		$("#search").click(function()
		{
			$.get("${pageContext.request.contextPath }/servlet/SearchFriend",{friendname:$("#friendname").val()},function(response)
			{
				
				$("#friendmessage").html(response);
			});
		});
		$("#savefriend").click(function()
		{
			$.get("${pageContext.request.contextPath }/servlet/AddFriend",{friendname:$("#friendname").val()},function(response)
			{
				$("#friendmessage").html("");
				
				$("<dt></dt>").html(response).appendTo($("#frienddl")).css("color","#F66");
			});
		});
		$("#blogartical").click(function()
	  	{
	  		$("#everyartical").slideToggle();
	  	});
	  	$("#blogphoto").click(function()
	  	{
	  		$("#everyphoto").slideToggle();
	  	});
	  	$("#masterfriend").click(function()
	  	{
	  		$("#frienddl").slideToggle();
	  	});
	});
</script>
</head>

<body>
  <jsp:include page="/page/head.jsp"></jsp:include>
<div id="center">
	<div id="left">
    	<div id="friend">
    	<div id="masterfriend" class="index">我的好友</div>
        	<dl id="frienddl" >
        		<c:forEach items="${friendlist }" var="friend">
        			<dt class="frienddt"><a href="${pageContext.request.contextPath }/servlet/ShowFriendBlog?id=${friend.QICQ }" class="frienda">${friend.name }</a></dt>
        		</c:forEach>
        		
        	</dl>
		</div>
		<div id="findfriend">
		      <dl >
        		<dt class="index">查找好友</dt>
        		<dt>好友名:<input type="text"  id="friendname"/></dt>
        		<dt><input id="search" type="button" value="  查找  "/>   <input type='button' value='  添加  ' id='savefriend'/></dt>
        		<dt><div id="friendmessage"></div></dt>
        		
        	</dl>
			
		</div>
        <div id="word">
        	<dl id="worddl">
        		<dt class="index">留言</dt>
        	</dl>
        </div>
    </div>
    <div id="right">
    	<div  id="artical">
        	<div class="index1" id="blogartical">博文</div>
        	<div id="everyartical">
	        	<c:forEach items="${articallist }" var="artical">
	        	<div class="entity">
	        		<div class="title">${artical.title }</div>
	        		<div class="ainfo">简介:${artical.info }</div>
	        		<div class="content"><span>${artical.content }</span></div>
	        		<div class="aother">
	        			<dt class="adt">阅读量  [${artical.count }] </dt>
	        			<dt class="adt"><a href="#">评论</a> </dt>
	        			<dt class="adt"><a href="${pageContext.request.contextPath }/servlet/ShowFriendArtical?id=${artical.id }">查看全文</a></dt>
	        		</div>
	        	</div>
	        	</c:forEach>
        	</div>
        </div>
    </div>
</div>
<div id="picture">
	<div class="index2" id="blogphoto">我的相册</div>
	<div id="everyphoto">
	<c:forEach items="${photolist }" var="photo">
		<dd class="photo"><img src="${pageContext.request.contextPath }/${photo.pathname }" alt="${photo.name } "/></dd>
	</c:forEach>
	</div>
</div>
<jsp:include page="/page/root.jsp" ></jsp:include>
</body>
</html>


photoupload

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!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>
body{
	margin:0px;
	padding:0px;
}
div{
	margin-left:20px;
	margin-top:20px;
}
body{
	background-image:url(../images/enitarticalbg.jpg);
	background-repeat:repeat-y;
}
#center{
	width:500px;
	margin:100px auto 100px;
	min-height:200px;
	background-color:#CCC;
}
#name input,#picture input,#info input{
	width:90%;
}
#submit input{
	margin-left:180px;
	height:40px;
	background-color:#C2E6EA;
	font-size:24px;
}
</style>
</head>

<body>
<div id="center">
    <form action="${pageContext.request.contextPath }/servlet/PhotoUpLoad" enctype="multipart/form-data" method="post">
    	<div id="name"><dl><dt>图片名:</dt><dt><input type="text"  name="name"/></dt></dl></div>
        <div id="picture"><dl><dt>图片:</dt><dt><input type="file" name="picture"/></dt></dl></div>
        <div id="info"><dl><dt>图片描述:</dt><dt><input type="text" name="photoinfo"/></dt></dl></div>
        <div id="submit"><input type="submit" value="提交照片" name="up"/></div>
    </form>
</div>
</body>
</html>


regiest

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!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" />
<link type="text/css" rel="stylesheet" href="../css/regiset.css"/>
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/regiest.js"></script>
<title>注册</title>
</head>

<body>
<form action="${pageContext.request.contextPath }/servlet/MasterFormAction" method="post">

	<table>
        <thead>
        <th colspan="2">用户注册</th>
        </thead>
        <tbody>
        	<tr>
            	<td class="c1">用户名</td><td id="i2"><dl>
                					<dt><input type="text" name="name" id="username"/></dt>
                                    <dt id="name"></dt>
                                   	<dt>6~18个字符,可使用字母、数字、下划线,需以字母开头</dt>
                                   	<dt class="error">${error.name }</dt>
                                   </dl></td>
            </tr>
             <tr>
            	<td class="c1">性别</td><td><dl>
                					<dt><input type="radio" name="sex" value="Woman">女性</input>
                                     <input type="radio" name="sex" value="Man" checked>男性 </<input /></dt>
                                    <dt></dt>
                				</dl></td>
            </tr>
            <tr>
            	<td class="c1">密码</td><td><dl>
                					<dt><input type="password" name="password" id="password"/><dt>
                					<dt class="error">${error.password }</dt>
                                 <dl></td>
            </tr>
            <tr>
            	<td class="c1">确认密码</td><td><dl>
                						<dt><input type="password" name="repassword" id="repassword"/><dt>
                						<dt class="error">${error.repassword }</dt>
                                        <dt id="repass"></dt>
                                    </dt></td>
            </tr>
            <tr>
            	<td class="c1">邮箱</td><td><dl>
                					<dt><input type="text" name="email" id="email"/></dt>
                                    <dt class="error">${error.email }</dt>
                				</dl></td>
            </tr>
            <tr>
            	<td class="c1">验证码</td> <td><input type="text" name="code"/>  <td><td><img  src="" /><td>
            </tr>
             <tr>
            	<td colspan="2" id="i1"><input type="submit" value="立即注册" /></td>
            </tr>
        </tbody>
    </table>

    
</form>
</body>
</html>

root

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

   <div id="root" style="min-height: 50px;text-align: center;font-size: 12px;	background-color:#E2E2E2; margin-top: 100px">
       版权信息	ytdxsyj © syjblog.com
   		
   </div>

showphoto

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
	<head>
	<style type="text/css">
		img{
		width: 500px;
		height: 300px;
		}
		dt{
		display: inline;
		}
		#picture{
		width: 80%;
		margin: 50px auto 50px;
		}
		body{
		background-color:#E2E2E2;
		}
	</style>
	</head>
	<body>
		  <jsp:include page="/page/head.jsp"></jsp:include>
					<dl id="picture">
						<c:forEach items="${photolist }" var="photo">
						<dt>
							<a class="thumb" name="${photo.name }" href="${pageContext.request.contextPath }/${photo.pathname }" title="${photo.pathname }">
								<img src="${pageContext.request.contextPath }/${photo.pathname }" alt="${photo.name }" />
							</a>
							
						</dt>
						</c:forEach>

					</dl>
	<jsp:include page="/page/root.jsp" ></jsp:include>
	</body>
</html>



分享到:
评论

相关推荐

    我的博客网站设计源代码

    Jsp+Servlet+Spring+JPA 采用MVC结构,轻松设计出属于你的博客

    基于Django框架的博客网站设计.docx

    ,本次课题主要是设计一个基于Django框架的B/S架构的小型博客网站。本次程序设计采用python语言,基于了Django的高级框架,完成了一个小型博客网站,并且网站内的信息均存储到MySql数据库中进行管理。该网站涉及了...

    个人博客网站的设计与实现源码

    个人博客网站的源码个人博客网站的源码个人博客网站的源码个人博客网站的源码个人博客网站的源码个人博客网站的源码个人博客网站的源码

    个人博客网站的设计与实现.rar

    个人博客网站的设计与实现.rar

    毕业设计 博客网站的设计与实现

    博客网站的设计与实现 内含 设计代码及毕业设计说明书 代码完全可以运行 毕业设计说明书非常完整

    小型博客网站设计

    一个基本的web博客网站设计,主要包含的设计功能为博客文章的浏览、编辑、发布、评论和收藏,文件的上传和下载、用户的登录注册管理,后端用到了时下热门的nodejs框架Express,数据库使用MangoDB。

    个人博客网站的设计与实现

    个人博客网站的设计与实现个人博客网站的设计与实现个人博客网站的设计与实现个人博客网站的设计与实现个人博客网站的设计与实现个人博客网站的设计与实现

    基于java_EE的旅游博客网站系统设计与实现毕业论文.docx

    基于java_EE的旅游博客网站系统设计与实现毕业论文.docx基于java_EE的旅游博客网站系统设计与实现毕业论文.docx基于java_EE的旅游博客网站系统设计与实现毕业论文.docx基于java_EE的旅游博客网站系统设计与实现毕业...

    基于SpringBoot的个人博客系统设计与实现-论文.docx

    基于SpringBoot的个人博客系统设计与实现-论文.docx基于SpringBoot的个人博客系统设计与实现-论文.docx基于SpringBoot的个人博客系统设计与实现-论文.docx基于SpringBoot的个人博客系统设计与实现-论文.docx基于...

    基于LINQ的博客网站毕业设计

    基于ASP.NET MVC的博客网站毕业设计:http://download.csdn.net/source/1644144 ASP.NET MVC网站部署样章:http://download.csdn.net/source/1641089 ASP.NET MVC GridView控件开发样章:...

    中国知网个人博客系统设计与实现相关论文(毕设可参考)

    5.Wordpress在中职商务网站建设中的应用_吴燕珍 6.基于Bootstrap和Wordpress个人博客的搭建_夏立波 7.基于JAVA的个人博客系统的设计与实现_余思源 8.基于Kohana的博客系统的研究与实现_刘小波 9.基于LNMP搭建...

    小型博客网站课程设计

    精美网页 动画制作 清新页面 小型个人网站

    基于HTML的个人博客网站设计源码

    本项目是基于HTML的个人博客网站设计源码,包含1043个文件,其中939个Markdown文件,34个Stylus文件,29个EJS文件,15个YAML文件,9个JavaScript文件,2个JSON文件,2个CSS文件,2个EOT文件,2个TTF文件和2个WOFF...

    博客网站设计

    博客网站是一个JSP与数据库技术结合的典型应用程序,由前台用户操作和后台管理员操作模块组成,其规划功能模块如下。 l 前台用户操作 该模块主要包括用户登录、用户注册、用户修改个人信息、文章查询和留言,公告...

    个人博客网站设计

    web大作业 ASP+OpenDB博客设计

    基于ASP.NET技术的博客网站设计

    博客秉承了个人网站的自由精神,但是综合了激发创造的新模式,使其更具开放和建设性。要在网络世界体现个人的存在,张扬个人的社会价值,拓展个人的知识视野,...该博客网站包括评论管理、图片管理和文章管理等模块。

    ASP.NET设计的博客网站

    网站内设计有个人登录注册,发表博客,浏览个人主页,浏览好友博客等功能。三层架构,与数据库相连接,界面清晰。

    个人博客页面设计(html + css)

    个人博客页面设计(html + css)

    html+php实现个人博客网站(超高分作业)毕业设计

    网站平台功能补充说明:1、动态显示博客信息(如当前所有博客数量,用户个人博客数量,以及博客内容信息);2、博客和评论发表的时间遵循北京时间;3、登录时只要输入账号密码即可,后台会自动判断该账号为普通用户...

    博客网站设计报告.docx

    博客网站设计报告.docx博客网站设计报告.docx博客网站设计报告.docx博客网站设计报告.docx博客网站设计报告.docx博客网站设计报告.docx博客网站设计报告.docx博客网站设计报告.docx

Global site tag (gtag.js) - Google Analytics