admin.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>PHP中文网商城后台管理</title> </head> <body> <!-- 后台分为上中下三部分,其中中间部分又分为左和右两部分,用表格进行布局 --> <table border="0" cellpadding="5" cellspacing="0" align="center" width="960"> <!-- 顶部 --> <tr> <td colspan="2"> <iframe src="../inc/top.html" name="top" height="70" width="100%" frameborder="0" scrolling="no"></iframe> </td> </tr> <tr><td colspan="2"><hr></td></tr> <!-- 主体 --> <tr> <!-- 左侧菜单 --> <td> <iframe src="../inc/left.html" name="left" height="600" width="140" frameborder="0" scrolling="no"></iframe> </td> <!-- 右侧内容区 --> <td> <iframe src="../inc/default.html" name="right" height="600" width="800" frameborder="0" scrolling="no" align="left"></iframe> </td> </tr> <tr><td colspan="2"><hr></td></tr> <!-- 底部 --> <tr> <td colspan="2"> <iframe src="../inc/footer.html" name="top" height="70" width="100%" frameborder="0" scrolling="no"></iframe> </td> </tr> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
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 width="160" bgcolor="lightcyan">PHP版本</th> <td width="400">PHP5.6+</td> </tr> <tr> <th width="160" bgcolor="lightcyan">数据库</th> <td width="400">MySql</td> </tr> <tr> <th width="160" bgcolor="lightcyan">硬盘空间</th> <td width="400">1TB</td> </tr> <tr> <th width="160" bgcolor="lightcyan">系统</th> <td width="400">windows</td> </tr> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
foots.html
实例
<!DOCTYPE html> <html> <head> <title>用户管理</title> <meta charset="utf-8"> </head> <body> <!-- 1.创建表格时使用的时table标签 2.创建表格的基本标签:先写行,再写列(单元格) 3.用户数据全部保存再单元格中 4.<table>下面的子标签:<tr>行,<td>列,单元格,<th>用在表头的的单元格</table> 5.<caption>表格的标题</caption> --> <!-- cellpadding 单元格宽度,cellspacing单元格与单元格间距 --> <table border="1" cellspacing="0" cellpadding="5" align="center" width="80%"> <caption><h3>商品管理管理</h3></caption> <!-- thead,tbody,tfoot仅仅是词汇表的 分区 标识,没有任何样式 --> <!-- 分组 --> <colgroup span="1" bgcolor="lightgreen" ></colgroup> <!-- <colgroup span="1" bgcolor="lightgreen" ></colgroup> <colgroup span="1" bgcolor="lightgreen" ></colgroup> <colgroup span="2" bgcolor="red"> <col bgcolor="lightgray"> <col> </colgroup> <colgroup span="1" bgcolor="cyan"></colgroup> --> <thead> <tr bgcolor="lightcyan"> <th colspan="2">基本信息</th> <th colspan="5">其它信息</th> </tr> <tr bgcolor="skyblue"> <th>ID</th> <th>名称</th> <th>缩略图</th> <th>价格</th> <th>状态</th> <th>上市时间</th> <th colspan="2">操作</th> </tr> </thead> <tbody> <tr align="center"> <td>1</td> <td>笔记本</td> <td><img src=""></td> <td>50000</td> <td>在售</td> <td>2018-01-05</td> <td><a href=""><img src="">立即购买</a></td> </tr> <tr align="center"> <td>1</td> <td>笔记本</td> <td><img src=""></td> <td>50000</td> <td>在售</td> <td>2018-01-05</td> <td><a href=""><img src="">立即购买</a></td> </tr> <tr align="center"> <td>1</td> <td>笔记本</td> <td><img src=""></td> <td>50000</td> <td>在售</td> <td>2018-01-05</td> <td><a href=""><img src="">立即购买</a></td> </tr> <tr align="center"> <td>1</td> <td>笔记本</td> <td><img src=""></td> <td>50000</td> <td>在售</td> <td>2018-01-05</td> <td><a href=""><img src="">立即购买</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="">...</a> <a href="">下一页</a> <a href="">尾页</a> </p> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
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>
运行实例 »
点击 "运行实例" 按钮查看在线实例
left.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>left</title> </head> <body> <h4>用户管理</h4> <ul type="none"> <li><a href="user.html" target="right">用户查询</a></li> <li><a href="">分类管理</a></li> </ul> <hr> <h4>商品管理</h4> <ul type="none"> <li><a href="foods.html" target="right">商品查询</a></li> <li><a href="">分类管理</a></li> </ul> <hr> <h4>订单管理</h4> <ul type="none"> <li><a href="order.html" target="right">订单查询</a></li> <li><a href="">分类管理</a></li> </ul> <hr> <h4>系统设置</h4> <ul type="none"> <li><a href="set.html" target="right">基本配置</a></li> <li><a href="">高级配置</a></li> </ul> <hr> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
order.html
实例
<!DOCTYPE html> <html> <head> <title>用户管理</title> <meta charset="utf-8"> </head> <body> <!-- 1.创建表格时使用的时table标签 2.创建表格的基本标签:先写行,再写列(单元格) 3.用户数据全部保存再单元格中 4.<table>下面的子标签:<tr>行,<td>列,单元格,<th>用在表头的的单元格</table> 5.<caption>表格的标题</caption> --> <!-- cellpadding 单元格宽度,cellspacing单元格与单元格间距 --> <table border="1" cellspacing="0" cellpadding="5" align="center" width="80%"> <caption><h3>商品管理管理</h3></caption> <!-- thead,tbody,tfoot仅仅是词汇表的 分区 标识,没有任何样式 --> <!-- 分组 --> <colgroup span="1" bgcolor="lightgreen" ></colgroup> <!-- <colgroup span="1" bgcolor="lightgreen" ></colgroup> <colgroup span="1" bgcolor="lightgreen" ></colgroup> <colgroup span="2" bgcolor="red"> <col bgcolor="lightgray"> <col> </colgroup> <colgroup span="1" bgcolor="cyan"></colgroup> --> <thead> <tr bgcolor="lightcyan"> <th colspan="2">基本信息</th> <th colspan="5">其它信息</th> </tr> <tr bgcolor="skyblue"> <th>ID</th> <th>名称</th> <th>缩略图</th> <th>价格</th> <th>状态</th> <th>上市时间</th> <th colspan="2">操作</th> </tr> </thead> <tbody> <tr align="center"> <td>1</td> <td>笔记本</td> <td><img src=""></td> <td>50000</td> <td>在售</td> <td>2018-01-05</td> <td><a href=""><img src="">立即购买</a></td> </tr> <tr align="center"> <td>1</td> <td>笔记本</td> <td><img src=""></td> <td>50000</td> <td>在售</td> <td>2018-01-05</td> <td><a href=""><img src="">立即购买</a></td> </tr> <tr align="center"> <td>1</td> <td>笔记本</td> <td><img src=""></td> <td>50000</td> <td>在售</td> <td>2018-01-05</td> <td><a href=""><img src="">立即购买</a></td> </tr> <tr align="center"> <td>1</td> <td>笔记本</td> <td><img src=""></td> <td>50000</td> <td>在售</td> <td>2018-01-05</td> <td><a href=""><img src="">立即购买</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="">...</a> <a href="">下一页</a> <a href="">尾页</a> </p> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
set.html
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>系统配置</title> </head> <body> <table border="0" cellpadding="5" cellspacing="0" align="center"> <caption><h3>系统信息表</h3></caption> <tr> <td width="160" align="right"><label for="title">网站标题</label></td> <td width="400" align="left"><input id="title" name="title" type="text" value="" placeholder="不多于28个字符" size="50" ></label></td> </tr> <tr> <td width="160" align="right"><label for="keywords">网站关键字</label></td> <td width="400" align="left"><input id="keywords" name="title" type="text" value="" placeholder="不多于20个字符" size="50" ></label></td> </tr> <tr> <td width="160" align="right"><label for="desc">网站描述</label></td> <td align="left"><textarea id="desc" name="desc" type="text" value="" placeholder="不多于120个字符" rows="5" cols="50" ></textarea></td> </tr> <tr> <td colspan="2" align="center"><button type="submit">提交</button> </td> </tr> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
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="" width="40"></td> <td valign="middle" width="650"><h3>在线商城后台管理系统</h3></td> <td valign="right"> <a href="">admin</a> <a href="">退出 </a> </td> </tr> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
user.html
实例
<!DOCTYPE html> <html> <head> <title>用户管理</title> <meta charset="utf-8"> </head> <body> <!-- 1.创建表格时使用的时table标签 2.创建表格的基本标签:先写行,再写列(单元格) 3.用户数据全部保存再单元格中 4.<table>下面的子标签:<tr>行,<td>列,单元格,<th>用在表头的的单元格</table> 5.<caption>表格的标题</caption> --> <!-- cellpadding 单元格宽度,cellspacing单元格与单元格间距 --> <table border="1" cellspacing="0" cellpadding="5" align="center" width="80%"> <caption><h3>用户管理</h3></caption> <!-- thead,tbody,tfoot仅仅是词汇表的 分区 标识,没有任何样式 --> <!-- 分组 --> <colgroup span="1" bgcolor="lightgreen" ></colgroup> <colgroup span="1" bgcolor="lightgreen" ></colgroup> <colgroup span="2" bgcolor="red"> <col bgcolor="lightgray"> <col> </colgroup> <colgroup span="1" bgcolor="cyan"></colgroup> <thead> <tr bgcolor="lightcyan"> <th colspan="2">基本信息</th> <th colspan="5">其它信息</th> </tr> <tr bgcolor="skyblue"> <th>ID</th> <th>姓名</th> <th>头像</th> <th>邮箱</th> <th>状态</th> <th colspan="2">操作</th> </tr> </thead> <tbody> <tr align="center"> <td>1</td> <td>ss</td> <td><img src=""></td> <td>xndy@yahoo.com</td> <td>启用</td> <td><a href=""><img src="">编辑</a></td> <td><a href="">删除</a></td> </tr> <tr align="center"> <td>1</td> <td>ss</td> <td><img src=""></td> <td>xndy@yahoo.com</td> <td>启用</td> <td><a href="">编辑</a></td> <td><a href="">删除</a></td> </tr> <tr align="center"> <td>1</td> <td>ss</td> <td><img src=""></td> <td>xndy@yahoo.com</td> <td>启用</td> <td><a href="">编辑</a></td> <td><a href="">删除</a></td> </tr> <tr align="center"> <td>1</td> <td>ss</td> <td><img src=""></td> <td>xndy@yahoo.com</td> <td>启用</td> <td><a href="">编辑</a></td> <td><a href="">删除</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="">...</a> <a href="">下一页</a> <a href="">尾页</a> </p> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例