项目目标
本项目主要是开发一个简易的文章发布系统,其主要功能有
1.后台对文章的增删改查
2.前台的文章列表及文章详情
项目达到的效果
后台文章管理页面:
<html><head> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta name="format-detection" content="telephone=no"> <title>文章管理</title> <meta charset="utf-8"> <style> .box{ background-color:#f0f0f0; } .title{ margin:0 auto; border:1px solid black; width:400px; } .middle{ margin:0 auto; border:1px solid black; width:400px; } .menu{ margin:-50px 0px 1px 319px; width:80px; } .content{ clear:both; } .art{ text-align:center; } .num{ float:left; border:1px solid black; width:50px; font-size: 13px; } .tit{ float:left; border:1px solid black; width:274px; font-size: 13px; } .act{ float:left; border:1px solid black; width:70px; font-size: 13px; } .bottom{ width:400px; margin:0 auto; border:1px solid black; clear:both; } </style> </head> <body> <div class="box"> <div class="title"><h1>后台管理系统</h1> <div class="menu"> <a href="admin_add.php">发布文章</a><br> <a href="admin_manage.php">管理文章</a> </div> </div> <div class="middle"> <div class="art">文章管理列表</div> <div class="num">编号</div> <div class="tit">标题</div> <div class="act">操作</div> <div class="content"> <div class="num">28</div> <div class="tit">Facebook 将 PHP 编译成 JVM 字节码?</div> <div class="act"> <a href="admin_modify.php?id=28">修改</a> <a href="admin_del_handle.php?id=28">删除</a> </div> <div class="num">27</div> <div class="tit">PHP 5.5 或将引入 Generators</div> <div class="act"> <a href="admin_modify.php?id=27">修改</a> <a href="admin_del_handle.php?id=27">删除</a> </div> <div class="num">26</div> <div class="tit">国外十大最流行PHP框架排名</div> <div class="act"> <a href="admin_modify.php?id=26">修改</a> <a href="admin_del_handle.php?id=26">删除</a> </div> <div class="num">25</div> <div class="tit">php接收标准输入解决分布式处理实现方法</div> <div class="act"> <a href="admin_modify.php?id=25">修改</a> <a href="admin_del_handle.php?id=25">删除</a> </div> <div class="num">24</div> <div class="tit">PhpStorm 6 发布,PHP 集成开发环境</div> <div class="act"> <a href="admin_modify.php?id=24">修改</a> <a href="admin_del_handle.php?id=24">删除</a> </div> <div class="num">23</div> <div class="tit">PHP闭包(Closure)初探</div> <div class="act"> <a href="admin_modify.php?id=23">修改</a> <a href="admin_del_handle.php?id=23">删除</a> </div> <div class="num">22</div> <div class="tit">为什么 PHP 应该使用 PDO 方式访问数据库</div> <div class="act"> <a href="admin_modify.php?id=22">修改</a> <a href="admin_del_handle.php?id=22">删除</a> </div> <div class="num">21</div> <div class="tit">PHP5.5 + Apache2.4.4 初体验(64位)</div> <div class="act"> <a href="admin_modify.php?id=21">修改</a> <a href="admin_del_handle.php?id=21">删除</a> </div> <div class="num">20</div> <div class="tit">Nginx 上的 php-fpm 资源侵占问题</div> <div class="act"> <a href="admin_modify.php?id=20">修改</a> <a href="admin_del_handle.php?id=20">删除</a> </div> <div class="num">19</div> <div class="tit">PHP开发:从程序化到面向对象编程</div> <div class="act"> <a href="admin_modify.php?id=19">修改</a> <a href="admin_del_handle.php?id=19">删除</a> </div> <div class="num">18</div> <div class="tit">动态网页制作PHP常用的正则表达式</div> <div class="act"> <a href="admin_modify.php?id=18">修改</a> <a href="admin_del_handle.php?id=18">删除</a> </div> <div class="num">15</div> <div class="tit">动态语言正成为开发者的重要工具</div> <div class="act"> <a href="admin_modify.php?id=15">修改</a> <a href="admin_del_handle.php?id=15">删除</a> </div> <div class="num">13</div> <div class="tit">用PHP编程语言开发动态WAP页面</div> <div class="act"> <a href="admin_modify.php?id=13">修改</a> <a href="admin_del_handle.php?id=13">删除</a> </div> </div> </div> <div class="bottom"> 欢迎联系我们<a href="http://www.php.cn">php中文网</a><br> 前台展示页面<a href="../home/home_list.php">php咨询站</a> </div> </div> </body></html>
后台发布文章页面:
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta name="format-detection" content="telephone=no" /> <title>发布文章</title> <meta charset="utf-8" /> <style> .box{ background-color:#f0f0f0; } .title{ background-color:#f0f0f0; width:400px; height:100px; border-bottom:1px solid black; } .menu{ margin:-25px 0px 1px 319px; width:80px; } .middle{ border-bottom:1px solid black; } .bottom{ } </style> </head> <body> <div class="box"> <div class="title"> <h1>后台管理系统</h1> <div class="menu"> <a href="admin_add.php">发布文章</a><br/> <a href="admin_manage.php">管理文章</a> </div> </div> <div class="middle"> <form method="post" action="admin_add_handle.php"> <div><h2>发布文章</h2></div> <div>标题:<input type="text" name="title" /></div><br/> <div>作者:<input type="text" name="author" /></div><br/> <div>简介:<br/><textarea name="description" cols="50" rows="4"></textarea></div><br/> <div>内容:<br/><textarea name="content" cols="50" rows="9" ></textarea></div><br/> <div><input type="submit" name="button" value="提交" /></div><br/> </form> </div> <br/><div class="bottom">欢迎联系我们<a href="http://www.php.cn">php中文网</a></div> </div> </body> </html>
后台修改文章页面:
<?php require_once("../connect.php"); $id=$_GET['id']; $sql="select * from article where id=$id"; $query = mysqli_query($conn,$sql); $data = mysqli_fetch_assoc($query); ?> <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta name="format-detection" content="telephone=no" /> <title>发布文章</title> <meta charset="utf-8" /> <style> .box{ background-color:#f0f0f0; } .title{ background-color:#f0f0f0; width:400px; height:100px; border-bottom:1px solid black; } .menu{ margin:-25px 0px 1px 319px; width:80px; } .middle{ border-bottom:1px solid black; } </style> </head> <body> <div class="box"> <div class="title"> <h1>后台管理系统</h1> <div class="menu"> <a href="admin_add.php">发布文章</a><br/> <a href="admin_manage.php">管理文章</a> </div> </div> <div class="middle"> <form method="post" action="admin_modify_handle.php"> <input type="hidden" name="id" value="<?php echo $data['id']?>" /> <div><h2>修改文章</h2></div> <div>标题:<input type="text" name="title" value="<?php echo $data['title']; ?>"/></div><br/> <div>作者:<input type="text" name="author" value="<?php echo $data['author']; ?>"/></div><br/> <div>简介:<br/><textarea name="description" cols="50" rows="4"><?php echo $data['description']; ?></textarea></div><br/> <div>内容:<br/><textarea name="content" cols="50" rows="9" ><?php echo $data['content']; ?></textarea></div><br/> <div><input type="submit" name="button" value="提交" /></div><br/> </form> </div> <br/><div class="bottom">欢迎联系我们<a href="http://www.php.cn">php中文网</a></div> </div> </body> </html>
前台文章列表页:
<html><head> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta name="format-detection" content="telephone=no"> <title>文章列表</title> <meta charset="utf-8"> <style> *{ box-sizing:border-box; } .box{ font-family: 宋体; margin:0px auto; width:400px; } .box a:link,.box a:visited,.box a:hover{color:#000000;text-decoration:underline; } .head{ background-color:#0f8ff2; height:80px; } .tit{ padding: 20px 20px; font-size:25px; } .content{ width:400px; min-height:100px; border:1px solid red; } .top_con{ width:400px; padding:10px; } .bottom_con{ margin-left:20px; width:400px; } .con_tit{ font-size:18px; margin:10px 0px 10px 10px; font-weight:bold; } .con_des{ text-indent:2em; font-size:18px; } .con_det{ padding: 0px 0px 0px 300px; } ul{ list-style:none; margin-left:-40px; } li{ margin:15px 0px 0px 0px; } .index{ margin:-5px 0px 0px 0px ; } .bg{ position:relative; top: -6px; background-color:#fff; margin-left:335px; } </style> </head> <body> <div class="box"> <div class="head"><div class="tit">php资讯站</div><span class="bg"><a href="../admin/admin_manage.php">后台入口</a></span></div> <div class="content"> <div class="top_con"> <div class="con_tit">用PHP编程语言开发动态WAP页面</div> <div class="con_des">WAP(无线通讯协议)是在数字移动电话、个人手持设备(PDA等)及计算机之间进行通讯的开放性全球标准协议。随着无线通讯的不断发展,静态的WAP页面在很多方面已经不能满足用户个性化的要求,因此开发者可以在WAP服务 </div> <div class="con_det"><a href="home_show.php?id=13">查看详细</a></div> <div class="con_tit">动态语言正成为开发者的重要工具</div> <div class="con_des">曾经程序语言世界里的二等公民,脚本语言(也叫动态语言)正成为开发者的重要工具。</div> <div class="con_det"><a href="home_show.php?id=15">查看详细</a></div> <div class="con_tit">动态网页制作PHP常用的正则表达式</div> <div class="con_des">正则表达式用于字符串处理、表单验证等场合,实用高效</div> <div class="con_det"><a href="home_show.php?id=18">查看详细</a></div> <div class="index"> <a href="home_list.php?page=1">首页</a> <a href="home_list.php?page=0">上一页</a> <a href="home_list.php?page=2">下一页</a> <a href="home_list.php?page=5">末页</a> </div> </div> <div class="bottom_con"> <div style="margin-left:10px;margin-top:20px,font-size:20px;">最新资讯</div> <ul> <li><a href="home_show.php?id=28">Facebook 将 PHP 编译成 JVM 字节码?</a></li> <li><a href="home_show.php?id=27">PHP 5.5 或将引入 Generators</a></li> <li><a href="home_show.php?id=26">国外十大最流行PHP框架排名</a></li> <li><a href="home_show.php?id=25">php接收标准输入解决分布式处理实现方法</a></li> <li><a href="home_show.php?id=24">PhpStorm 6 发布,PHP 集成开发环境</a></li> <li><a href="home_show.php?id=23">PHP闭包(Closure)初探</a></li> </ul> </div> </div> </div> </body></html>
前台文章详情页:
<html><head> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> <meta name="format-detection" content="telephone=no"> <title>文章列表</title> <meta charset="utf-8"> <style> *{ box-sizing:border-box; } .box{ font-family: 宋体; margin:0px auto; width:400px; } .box a:link,.box a:visited,.box a:hover{color:#000000;text-decoration:underline; } .head{ background-color:#0f8ff2; height:80px; } .tit{ padding: 20px 40px; font-size:25px; } .content{ width:400px; min-height:100px; border:1px solid red; } .top_con{ width:400px; padding:5px 10px 20px 10px ; } .bottom_con{ margin:0px 0px 0px -1px; width:400px; } .con_tit{ font-size:22px; margin:20px 0px 10px 10px; font-weight:bold; } .con_aut{ font-size:13px; padding-left:10px; padding-top:10px; } .con_des{ padding-top:15px; text-indent:2em; font-size:18px; padding-left:10px } .con_det{ text-indent:2em; font-size:17px; margin:20px 0px 0px 0px; padding-left:10px } ul{ list-style:none; margin-left:-30px; } li{ margin:15px 0px 0px 0px; } </style> </head> <body> <div class="box"> <div class="head"><a href="home_list.php">返回</a><div class="tit">php资讯站</div></div> <div class="content"> <div class="top_con"> <div class="con_tit">用PHP编程语言开发动态WAP页面</div> <div class="con_aut">php中文网 发表于2016-11-01</div> <div class="con_des">WAP(无线通讯协议)是在数字移动电话、个人手持设备(PDA等)及计算机之间进行通讯的开放性全球标准协议。随着无线通讯的不断发展,静态的WAP页面在很多方面已经不能满足用户个性化的要求,因此开发者可以在WAP服务 </div> <div class="con_det">WAP(无线通讯协议)是在数字移动电话、个人手持设备(PDA等)及计算机之间进行通讯的开放性全球标准协议。随着无线通讯的不断发展,静态的WAP页面在很多方面已经不能满足用户个性化的要求,因此开发者可以在WAP服务器端使用诸如PHP等语言产生动态的WML页面,来满足用户的需要。 WAP的应用结构非常类似于Internet,一个典型的WAP应用请求步骤描述如下: 1. 具有WAP用户代理功能的移动终端(如WAP手机),通过内部运行的微浏览器向某一网站发送WAP服务请求。该请求先由WAP网关截获,对信息内容进行编码压缩,以减少网络数据流量,同时根据需要将WAP协议转换成HTTP协议。 2. 协议将处理后的请求转送到相应WAP服务器。在WAP服务器端,根据页面扩展名等属性,被请求的页面直接或由服务器端脚本解释后输出,再经过网关传回给用户。 从上述的WAP应用流程可以发现,生成动态WAP页面与动态产生Web网页的过程非常相似。但是由于WAP应用使用的WML语言来源于语法严格的XML,因此要求输出的格式必须按WAP网页的规范输出。同时,由于WAP协议的应用范围及移动客户端的软、硬件配置等局限性,对每次输出的页面的大小、图像的格式及容量都有一定限制。本文笔者将以PHP语言为例,和广大网络程序开发爱好者共同探讨动态输出WAP页面的方法和应用。 输出简单的动态WAP页面 由于生成WAP页面的过程和生成一般的Web页面非常类似,笔者通过一个最简单的WAP页面的例子来介绍。不过提醒一句:由于需要PHP解释器来解释该程序并输出WAP页面,因此所有类似的程序应以“php”为扩展名哦。 该实例可以在WAP手机模拟器中浏览,输出一句经典的“Hello WAP”语句,但是在普通的网络浏览器中是无法识别的,原因很简单,在程序开头声明了该输出文档为WML类型,只有WAP设备能够识别并解释。不过又要提醒一句:常见的HTML语言对规范性要求不严,大多数浏览器能“宽容”地接受其中的编写错误,但是WML的规范相当严格,任何的错误都可能导致无法输出所需的页面。</div> </div> <div class="bottom_con"> <div style="margin-left:10px;font-size:20px;">最新资讯</div> <ul> <li><a href="home_show.php?id=28">Facebook 将 PHP 编译成 JVM 字节码?</a></li> <li><a href="home_show.php?id=27">PHP 5.5 或将引入 Generators</a></li> <li><a href="home_show.php?id=26">国外十大最流行PHP框架排名</a></li> <li><a href="home_show.php?id=25">php接收标准输入解决分布式处理实现方法</a></li> <li><a href="home_show.php?id=24">PhpStorm 6 发布,PHP 集成开发环境</a></li> <li><a href="home_show.php?id=23">PHP闭包(Closure)初探</a></li> </ul> </div> </div> </div> </body></html>
每个页面,我们之后都会详细介绍,下一节我们介绍整个项目的文件组成