Affichage des effets du système de publication d'articles de développement PHP
Objectifs du projet
Ce projet consiste principalement à développer un système de publication d'articles simple, ses principales fonctions sont
1. Vérifiez l'ajout, la suppression et la modification des articles dans le backend
2. Liste des articles et détails des articles dans le frontend
L'effet obtenu par le projet
Page de gestion des articles backend :
<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="//m.sbmmt.com">php中文网</a><br>
前台展示页面<a href="../home/home_list.php">php咨询站</a>
</div>
</div>
</body></html>Page de publication d'articles backend :
<!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="//m.sbmmt.com">php中文网</a></div>
</div>
</body>
</html>Page de modification d'articles backend :
<?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="//m.sbmmt.com">php中文网</a></div>
</div>
</body>
</html>Page de liste d'articles front-end :
<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>Page de détails de l'article frontal :
<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>Nous présenterons chaque page en détail plus tard. Dans la section suivante, nous présenterons la composition des fichiers de l'ensemble du projet
![Projet front-end-Shangyou [Pratique complète de la technologie HTML/CSS/JS]](https://img.php.cn/upload/course/000/000/068/63bfcb2974f91471.jpg)
![Cours frontal base zéro [Vue apprentissage avancé et application pratique]](https://img.php.cn/upload/course/000/000/068/63bbd15353895588.jpg)
![Tutoriel WEB front-end [HTML5+CSS3+JS]](https://img.php.cn/upload/course/000/000/068/63ba60c8da520536.jpg)
![Application pratique Apipost [api, interface, tests automatisés, mock]](https://img.php.cn/upload/course/000/000/068/63b3c967a20f4861.jpg)
