新闻列表页之列表展示,删除功能前端代码
本章节介绍了新闻列表的前端展示,主要是功能实现,所以前端做的比较简单。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<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>
<style>
.top{
width: 410px;
margin:0 auto;
}
.ti{
font-family: 微软雅黑;
}
a{
text-decoration: none;
}
.cl{
color:#000000;
line-height:50px;
}
.pt50{
padding-top: 50px;
}
.w200{
width:100px;
}
.w410{
width: 410px;
}
.btn_1 {
display: inline-block;
line-height: 5px;
padding: 15px 0;
margin-bottom: 30px;
border-radius: 3px;
font-family: 微软雅黑;
background: #03a9f4;
border: 1px solid #0398db;
color: #fff;
font-size: 17px;
text-align: center;
cursor: pointer;
float: right;
}
</style>
</head>
<body>
<div class="top">
<div style="background:#00CC66;width: 400px;height: 80px;">
<h2 style= "text-align:center;">新闻网页简单实例</h2>
</div>
<div class="pt50 w410">
<span>
<form method="post" action="lists.php">
<?php while($row=mysqli_fetch_assoc($result)):?>
<p style="float:right">
<a href="xgai.php?id=<?php echo $row['id']?>" target="_blank;">修改</a>/<a href="?idD=<?php echo $row['id']?>">删除</a></p>
<p>标题:<?php echo $row['title'];?></p>
<p>内容:<?php echo $row['content'];?></p>
<p>作者:<?php echo $row['author'];?></p>
<p><?php echo $row['create_at']?></p>
<hr>
<?php endwhile;?>
</form>
<div class="btn_1 w200">
<p ><a href="xgai.php" target="_blank;">新增</a></p>
</div>
</span>
</div>
</body>
</html>代码解释:
style标签内的是CSS样式,相信大家都能看的懂。
<?php while($row=mysqli_fetch_assoc($result)):?><?php endwhile;?>
这段代码可能有的人会不太理解,这个就是将数据库的数据在列表中循环出来。也就是说,数据库中有多少条新闻数据,页面上就会展示多少条,不需要我们一条一条写出来。
<?php echo $row['id']?>
<?php echo $row['title'];?>
像这样的也是循环,是将标题,内容等都循环出来。
