admin.html
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<table cellspacing="0" cellpadding="5" width="980" align="center" bgcolor="#CCCCCC">
<tr height=70>
<td colspan="2">
<iframe src="view/top.html" name="top" height="70" width="100%" frameborder="0" align="center" scrolling="no"></iframe>
</td>
</tr>
<tr><td colspan="2"><hr></td></tr>
<tr height=600>
<td width="17%">
<iframe src="view/left.html" name="left" height="600" width="160" frameborder="0" align="right" scrolling="no"></iframe>
</td>
<td>
<iframe src="view/default.html" name="right" height="600" width="820" frameborder="0" align="right" scrolling="no"></iframe>
</td>
</tr>
<tr><td colspan="2"><hr></td></tr>
<tr height=60>
<td colspan="2">
<iframe src="view/footer.html" name="footer" height="60" width="100%" frameborder="0" align="center" scrolling="no"></iframe>
</td>
</tr>
</table>
</body>
</html>
点击 "运行实例" 按钮查看在线实例
top.html
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<table border="0">
<tr>
<td>
<img src="../images/logo.jpg" width="40">
</td>
<td width="700">
<a href=""><h3>在线管理系统</h3></a>
</td>
<td>
<p><a href="">admin</a> <a href="">退出</a></p>
</td>
</tr>
</table>
</body>
</html>
点击 "运行实例" 按钮查看在线实例
left.html
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<h4><img src="../images/user.jpg" width="30">用户管理</h4>
<ul>
<li><img src="../images/file.jpg" width="20"><a href="user.html" target="right">用户注册</a></li>
<li><img src="../images/file.jpg" width="20"><a href="#">用户管理</a></li>
</ul>
<hr>
<h4><img src="../images/user.jpg" width="30">用户登录</h4>
<ul>
<li><img src="../images/file.jpg" width="20"><a href="log.html" target="right">用户登录</a></li>
<li><img src="../images/file.jpg" width="20"><a href="#">分类管理</a></li>
</ul>
<hr>
<h4><img src="../images/user.jpg" width="30">数据库管理</h4>
<ul>
<li><img src="../images/file.jpg" width="20"><a href="deta.html" target="right">订单查询</a></li>
<li><img src="../images/file.jpg" width="20"><a href="#">数据库设置</a></li>
</ul>
<hr>
<h4><img src="../images/user.jpg" width="30">留言</h4>
<ul>
<li><img src="../images/file.jpg" width="20"><a href="edit.html" target="right">留言</a></li>
<li><img src="../images/file.jpg" width="20"><a href="#">留言管理</a></li>
</ul>
</body>
</html>
点击 "运行实例" 按钮查看在线实例
footer.html
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<P align="center">
<a href="">广播电视节目制作经营许可证：（沪）字第1248号 </a>
</P>
</body>
</html>
点击 "运行实例" 按钮查看在线实例
default.html
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="5" align="center">
<caption><h3>服务器信息</h3></caption>
<tr>
<th width="160" bgcolor="#666666">服务器计算机名</th>
<td width="400">http://127.0.0.1</td>
</tr>
<tr>
<th bgcolor="#666666">服务器IP地址</th>
<td>192.168.1.1</td>
</tr>
<tr>
<th bgcolor="#666666">服务器域名</th>
<td>www.h-ui.net</td>
</tr>
<tr>
<th bgcolor="#666666">服务器端口 </th>
<td>80</td>
</tr>
<tr>
<th bgcolor="#666666">服务器IIS版本 </th>
<td>Microsoft-IIS/6.0</td>
</tr>
</table>
</body>
</html>
点击 "运行实例" 按钮查看在线实例
user.html
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
table tr{
text-align: center;
}
</style>
</head>
<body>
<form action="" method="post">
<table border="0" align="center" width="500" cellpadding="8" cellspacing="0" bgcolor="#669966">
<caption><h3>注册</h3></caption>
<tr><td colspan="2"><hr></td></tr>
<tr>
<td width="60" align="right">
<label for="username">用户名</label>
</td>
<td width="300" align="left">
<input type="text" name="username" id="username" placeholder="由字母和数字组成不少与7位" size="30">
</td>
</tr>
<tr>
<td align="right">
<label for="password">密码</label>
</td>
<td align="left">
<input type="password" name="password" id="password" placeholder="6-16个字符，区分大小写" size="30">
</td>
</tr>
<tr>
<td align="right">
<label for="text">邮箱</label>
</td>
<td align="left">
<input type="text" name="email" id="email" placeholder="dsss@163.com" size="30">
</td>
</tr>
<tr>
<td align="right">
<a>性别</a>
</td>
<td align="left">
<input type="radio" name="sex" value="secret" checked="">保密
<input type="radio" name="sex" value="male">男
<input type="radio" name="sex" value="famale">女
</td>
</tr>
<tr>
<td align="right">
<a>如何了解本站</a>
</td>
<td align="left">
<input type="checkbox" name="1[]" value="">保密
<input type="checkbox" name="1[]" value="">朋友安利
<input type="checkbox" name="1[]" value="">网站推广
</td>
</tr>
<tr>
<td align="right">
<a>级别</a>
</td>
<td align="left">
<select name="sel" id="sel">
<option selected="">——请选择——</option>
<option>我是小白</option>
<option>已经入门</option>
<option>我是大神</option>
</select>
</td>
</tr>
<tr>
<td align="right">
<a>头像</a>
</td>
<td align="left">
<img src="img/10.png" height="35">
<input type="file" name="photo" id="photo" accept="image/*">
</td>
</tr>
<tr>
<td align="right"><label for="cont">简介</label></td>
<td align="left"><textarea name="cont" id="cont" rows="5" cols="40" placeholder="在这里留下你的简介"></textarea> </td>
</tr>
<tr>
<td colspan="2" align="center">
<hr>
<input type="submit" name="sub" id="sub" value="提交">
</td>
</tr>
</table>
</form>
</body>
</html>点击 "运行实例" 按钮查看在线实例
log.html
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
p{
text-align: center;
}
</style>
</head>
<body>
<form action="" method="post">
<fieldset>
<legend>用户登录</legend>
<p width="500">
<label>邮箱:<input type="email" name="email" placeholder="dsa@163.com"></label>
</p>
<p>
<label>密码:<input type="email" name="email"></label>
</p>
<hr width="500">
<p><button type="submit" name="submit">登录</button></p>
</fieldset>
</form>
</body>
</html>点击 "运行实例" 按钮查看在线实例
data.html
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
table tr{
text-align: center;
}
</style>
</head>
<body>
<table border="1" cellspacing="0" cellpadding="5" width="50%" align="center">
<caption><h3>数据库</h3></caption>
<thead>
<tr bgcolor="skyblue" >
<th>id</th>
<th>user</th>
<th>password</th>
<th>name</th>
<th>操作</a></th>
</tr>
</thead>
<tbody>
<tr>
<td>01</td>
<td>fds123</td>
<td>1356</td>
<td>jojo</td>
<td><a href="#"><img src="images/update.png"><img src="images/delete.png"></a></td>
</tr>
<tr>
<td>02</td>
<td>c4552</td>
<td>13526</td>
<td>辅导教师</td>
<td><a href="#"><img src="images/update.png"><img src="images/delete.png"></a></td>
</tr>
<tr>
<td>03</td>
<td>cds22</td>
<td>026</td>
<td>多少钱</td>
<td><a href="#"><img src="images/update.png"><img src="images/delete.png"></a></td>
</tr>
</tbody>
<tfoot>
</tfoot>
</table>
<p align="center">
<a href="#">首页</a>
<a href="#">上一页</a>
<a href="#">1</a>
<a href="#">2</a>
<a href="#">3</a>
<a href="#">...</a>
<a href="#">下一页</a>
<a href="#">尾页</a>
</p>
</body>
</html>点击 "运行实例" 按钮查看在线实例
edit.html
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<table align="center" cellpadding="5">
<caption>
<h3>留言</h3>
<hr width="80%">
</caption>
<tr>
<td align="right">
<label for="title">标题:</label>
</td>
<td align="left">
<input type="text" id="title" name="title" size="49">
</td>
</tr>
<tr>
<td valign="middle" align="right"><label for="desc">内容:</label></td>
<td align="left">
<textarea id="desc" name="desc" rows="5" cols="50"></textarea>
</td>
</tr>
<tr>
<td align="center" colspan="2">
<input type="submit" name="" value="发表">
</td>
</tr>
</table>
</body>
</html>
点击 "运行实例" 按钮查看在线实例
Correction status：Uncorrected
Teacher's comments：
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
Collection
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
