이 장에서는 뉴스 목록의 프런트엔드 표시를 소개하며 주로 기능 구현을 소개하므로 프런트엔드는 비교적 간단합니다.
<!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'];?>
이것도 제목, 내용을 결합하는 루프입니다. 등. 반복하세요.
다음 섹션