一、代码:
1、index.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>PHP中文网后台管理系统</title> </head> <body> <table border="0" cellspace="1" cellpadding="5" align="center" width="960"> <!-- 头部 --> <tr> <td colspan="2"> <iframe src="inc/top.html" name="top" height="70" width="100%" align="center" frameborder="0" scrolling="no"></iframe> </td> </tr> <!-- 分割线 --> <tr><td colspan="2" width="100%"><hr></td></tr> <!-- 中间分左右两部分 --> <tr> <!-- 左侧菜单栏 --> <td> <iframe src="inc/left.html" name="left" height="600" width="140" align="center" frameborder="0" scrolling="no"></iframe> </td> <!-- 右侧展示栏 --> <td> <iframe src="inc/default.html" name="right" height="600" width="800" align="left" frameborder="0" scrolling="no"></iframe> </td> </tr> <!-- 分割线 --> <tr><td colspan="2" width="100%"><hr></td></tr> <!-- 底部信息栏 --> <tr> <td colspan="2" align="center"> <iframe src="inc/footer.html" name="footer" width="100%" height="70" align="center" frameborder="0" scrolling="no"></iframe> </td> </tr> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
2、头部 top.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>top</title> </head> <body> <table border="0"> <tr> <td valign="middle"><img src="../images/logo.jpg" width="40"></td> <td valign="middle" width="650"> <h2 align="left">PHP中文网后台管理系统</h2> </td> <td align="right"> <p> <a href="">admin</a> <a href="">退出</a> </p> </td> </tr> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
3、左侧菜单 left.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>left</title> </head> <body> <h4><img src="../images/user.jpg" width="30">用户管理</h4> <ul type="none"> <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> <h4><img src="../images/folder.jpg" width="30">商品管理</h4> <ul type="none"> <li> <img src="../images/file.jpg" width="20"><a href="foods.html" target="right">商品信息</a> </li> <li><img src="../images/file.jpg" width="20"><a href="">分类管理</a></li> </ul> <h4><img src="../images/folder.jpg" width="30">订单管理</h4> <ul type="none"> <li> <img src="../images/file.jpg" width="20"><a href="order.html" target="right">订单查询</a> </li> <li><img src="../images/file.jpg" width="20"><a href="">分类管理</a></li> </ul> <h4><img src="../images/set.jpg" width="30">系统设置</h4> <ul type="none"> <li> <img src="../images/file.jpg" width="20"><a href="system.html" target="right">普通配置</a> </li> <li><img src="../images/file.jpg" width="20"><a href="">高级配置</a></li> </ul> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
4、右侧默认 default.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>默认后台首页</title> </head> <body> <table border="1" cellspacing="0" cellpadding="5" align="center"> <caption><h3>系统配置信息表</h3></caption> <tr> <th width="160" bgcolor="lightcyan">服务器</th> <td width="400">Apache 2.8.1</td> </tr> <tr> <th bgcolor="lightcyan">PHP版本</th> <td>PHP5.6+</td> </tr> <tr> <th bgcolor="lightcyan">数据库</th> <td>MySQL 5.7</td> </tr> <tr> <th bgcolor="lightcyan">可用磁盘空间</th> <td>395G</td> </tr> <tr> <th bgcolor="lightcyan">可用内存</th> <td>3.2G</td> </tr> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
5、用户信息 user.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>用户信息</title> </head> <body> <table border="1" cellspacing="0" cellpadding="10" width="600" align="center"> <caption><h2>用户信息表</h2></caption> <thead> <tr bgcolor="skyblue"> <th>ID</th> <th>姓名</th> <th>性别</th> <th>爱好</th> <th>电话</th> <th>QQ号</th> <th>操作</th> </tr> </thead> <tbody> <tr align="center"> <td>01</td> <td>张三</td> <td>女</td> <td>看电影</td> <td>13211111111</td> <td>354656</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>02</td> <td>李四</td> <td>男</td> <td>打网球</td> <td>15290347583</td> <td>2255566</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>03</td> <td>王五</td> <td>女</td> <td>画画</td> <td>15809485859</td> <td>86544323</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>04</td> <td>钱六</td> <td>男</td> <td>游泳</td> <td>18957555524</td> <td>97899324</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>05</td> <td>赵七</td> <td>男</td> <td>打篮球</td> <td>15657485524</td> <td>97899324</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></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>
运行实例 »
点击 "运行实例" 按钮查看在线实例
6、商品信息 foods.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>商品信息</title> </head> <body> <table border="1" cellspacing="0" cellpadding="10" width="600" align="center"> <caption><h2>商品信息表</h2></caption> <thead> <tr bgcolor="skyblue"> <th>商品ID</th> <th>商品</th> <th>价格</th> <th>存储条件</th> <th>商品编码</th> <th>条码</th> <th>操作</th> </tr> </thead> <tbody> <tr align="center"> <td>01</td> <td>可乐</td> <td>199</td> <td>常温</td> <td>13211111111</td> <td>354656</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>02</td> <td>雪碧</td> <td>56</td> <td>冷冻</td> <td>15290347583</td> <td>2255566</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>03</td> <td>酸奶</td> <td>88</td> <td>冷藏</td> <td>15809485859</td> <td>86544323</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>04</td> <td>椰汁</td> <td>99</td> <td>常温</td> <td>18957555524</td> <td>97899324</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>05</td> <td>橙汁</td> <td>66</td> <td>冷冻</td> <td>15657485524</td> <td>97899324</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></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>
运行实例 »
点击 "运行实例" 按钮查看在线实例
7、订单信息 order.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>订单信息</title> </head> <body> <table border="1" cellspacing="0" cellpadding="10" width="600" align="center"> <caption><h2>订单信息表</h2></caption> <thead> <tr bgcolor="skyblue"> <th>订单ID</th> <th>商品</th> <th>价格</th> <th>存储条件</th> <th>商品编码</th> <th>条码</th> <th>操作</th> </tr> </thead> <tbody> <tr align="center"> <td>01</td> <td>可乐</td> <td>199</td> <td>常温</td> <td>13211111111</td> <td>354656</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>02</td> <td>雪碧</td> <td>56</td> <td>冷冻</td> <td>15290347583</td> <td>2255566</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>03</td> <td>酸奶</td> <td>88</td> <td>冷藏</td> <td>15809485859</td> <td>86544323</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>04</td> <td>椰汁</td> <td>99</td> <td>常温</td> <td>18957555524</td> <td>97899324</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></td> </tr> <tr align="center"> <td>05</td> <td>橙汁</td> <td>66</td> <td>冷冻</td> <td>15657485524</td> <td>97899324</td> <td><img src="../images/edit.jpg" width="20" alt="编辑" title="编辑"> <img src="../images/del.jpg" width="20" alt="删除" title="删除"></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>
运行实例 »
点击 "运行实例" 按钮查看在线实例
8、系统设置 system.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>系统信息</title> </head> <body> <table border="0" cellspacing="0" cellpadding="5" align="center"> <caption> <h3>系统配置信息表</h3> </caption> <tr> <td width="160" align="right"><label for="title">网站标题:</label></td> <td width="400" align="left"><input type="text" id="title" name="title" value="" placeholder="不多于28个字符" size="48"></td> </tr> <tr> <td align="right"><label for="keywords">网站关键字:</label></td> <td align="left"><input type="text" id="keywords" name="keywords" value="" placeholder="不多于40个字符" size="48"></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" placeholder="不多于120个字符"></textarea></td> </tr> <tr> <td align="center" colspan="2"> <input type="image" name="submit" src="../images/submit.jpg" width="90"> </td> </tr> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
9、底部 footer.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>footer</title> </head> <body> <p align="center"> <a href="">PHP中文网(www.php.cn)在线商城</a> ©版权所有 <a href="">备案号:皖ICP-*******</a> </p> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
二、手写代码: