Java网络编程--模拟B\S服务器

叁歲伎倆 2022-01-27 04:41 132阅读 0赞

模拟网站服务器，使用浏览器访问自己编写的服务端程序，查看网页效果。  
图片你们没有，复制代码自己运行的时候可能会出现小问题，我的图片在img里放着

> 1—index.html

部分截图  
![在这里插入图片描述][20190531163359305.jpg]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MjA1MTI5_size_16_color_FFFFFF_t_70]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MjA1MTI5_size_16_color_FFFFFF_t_70 1]

> 2—reg.html

<!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title>注册页面</title>
    		<style type="text/css">
    			/*页面整体背景图*/
    			body{
    				background-image: url(img/bg.jpg);	
    			}
    			/*
    			 * 外层白色背景
    			 */
    			.formId{
    				width: 700px;
    				height: 500px;
    				border: 1px solid #333;
    				margin: 150px auto;
    				background-color: #FFFFFF;
    				padding-top: 30px;
    				padding-left:150px;
    			}
    			/*
    			 * 表单注册区域
    			 */
    			.formReg{
    				width: 500px;
    				height: 450px;
    				border: 0px solid #333;
    			}
    			h3{
    				color: #0000FF;
    				font-size: 20px;
    			}
    			h3 span{
    				color: #000000;
    				font-size:16px;
    			}
    			tr{
    				height: 35px;
    			}
    			.in{
    				width: 200px;
    				height: 30px;
    				margin-left: 10px;
    			}
    			
    		</style>
    	</head>
    	<body>
    		<div class="formId">
    			<div class="formReg">
    				<h3>用户注册 <span> USERREGiSTER</span></h3>
    				<form action="#" method="get">
    				<table width="500px">
    					<tr>
    						<td align="right">用户名</td>
    						<td colspan="2"><input  class="in" name="username" placeholder="请输入用户名"/></td>
    					</tr>
    					<tr>
    						<td align="right">密码</td>
    						<td colspan="2"><input class="in" type="password" name="password" placeholder="请输入用密码"/></td>
    					</tr>
    					<tr>
    						<td align="right">性别</td>
    						<td colspan="2">男<input type="radio" name="sex" checked="checked"/>
    						            女<input type="radio" name="sex"></td>
    					</tr>
    					<tr>
    						<td align="right">验证码</td>
    						<td><input type="text" name="code"></td>
    						<td><img src="img/checkcode.jpg"></td>
    					</tr>
    					<tr>						
    						<td colspan="3" align="center">
    							<input type="image" src="img/btn.jpg" />
    						</td>
    					</tr>
    				</table>
    				</form>
    			</div>
    		</div>
    	</body>
    </html>

部分图片  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MjA1MTI5_size_16_color_FFFFFF_t_70 2]

[20190531163359305.jpg]: /images/20220127/118872a0f9474c5580d910dac53ad406.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MjA1MTI5_size_16_color_FFFFFF_t_70]: /images/20220127/ee662be8847c4b1abe9a3485ef584807.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MjA1MTI5_size_16_color_FFFFFF_t_70 1]: /images/20220127/ab37cc86e1ef41c3bbbb9f8135e4f584.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM5MjA1MTI5_size_16_color_FFFFFF_t_70 2]: /images/20220127/4617f81ee45d44338f55227d6b1baeff.png