跟着老雷学PHP,24小时学会留言板开发。
本节课我们来设计一下留言板的页面,页面分为首页,发布页,回复页,提示页等5个页面。相对来说比较简单。
更换封面
15:55 视频尚未发布,暂时无法播放
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>留言板</title> <meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1" /> <link href="css/app.css" rel ="stylesheet" /> <style> .list{ width: 98%; margin: 0 auto; } .item{ padding : 10px; margin-bottom: 10px; border : 1px solid #eee; border-radius: 10px; } .item-title{ margin-bottom: 5px; } .item-other{ display: flex; flex-direction: row; margin-bottom: 5px; color: #969696; font-size: 14px; } .item-desc{ color: #646464; font-size: 14px; } .item-reply{ margin: 10px; border: 1px solid #eee; padding: 10px; } fieldset{ border-radius: 5px; } legend{ color: #969696; font-size: 12px; } </style> </head> <body> <div class="main"> <div class="nav"> <a class="active" href="index.html">留言首页</a> <a href="add.html">我要留言</a> </div> <div class="list"> <div class="item"> <div class="item-title"> 这是留言标题,请问留言板怎么开发呢 </div> <div class="item-other"> <div class="mgr-10">老雷</div> <div>15985840591</div> <div class="flex-1"></div> <div class="f12 mgr-5">09.03 10:50</div> </div> <div class="item-desc cl2"> 请问留言板怎么开发呢,学会开发留言板要多久呢 </div> <fieldset class="item-reply"> <legend>回复</legend> <div class="item-desc cl2"> 跟着老雷学习,快速学会开发留言板。<br/> 微信/电话:15985840591. </div> </fieldset> </div> <div class="item"> <div class="item-title"> 这是留言标题,请问留言板怎么开发呢 </div> <div class="item-other"> <div class="mgr-10">老雷</div> <div>15985840591</div> <div class="f12 mgr-5">09.03 10:50</div> <a href="reply.html" class="f12 cl1">我要回复</a> </div> <div class="item-desc cl2"> 请问留言板怎么开发呢,学会开发留言板要多久呢 </div> </div> <div class="item"> <div class="item-title"> 这是留言标题,请问留言板怎么开发呢 </div> <div class="item-other"> <div class="mgr-10">老雷</div> <div>15985840591</div> <div>2019.09.03 10:50</div> </div> <div class="item-desc cl2"> 请问留言板怎么开发呢,学会开发留言板要多久呢 </div> <fieldset class="item-reply"> <legend>回复</legend> <div class="item-desc cl2"> 跟着老雷学习,快速学会开发留言板。<br/> 微信/电话:15985840591. </div> </fieldset> </div> <div class="item"> <div class="item-title"> 这是留言标题,请问留言板怎么开发呢 </div> <div class="item-other"> <div class="mgr-10">老雷</div> <div>15985840591</div> <div class="f12 mgr-5">09.03 10:50</div> <a href="reply.html" class="f12 cl1">我要回复</a> </div> <div class="item-desc cl2"> 请问留言板怎么开发呢,学会开发留言板要多久呢 </div> </div> <div class="item"> <div class="item-title"> 这是留言标题,请问留言板怎么开发呢 </div> <div class="item-other"> <div class="mgr-10">老雷</div> <div>15985840591</div> <div>09.03 10:50</div> </div> <div class="item-desc cl2"> 请问留言板怎么开发呢,学会开发留言板要多久呢 </div> <fieldset class="item-reply"> <legend>回复</legend> <div class="item-desc cl2"> 跟着老雷学习,快速学会开发留言板。<br/> 微信/电话:15985840591. </div> </fieldset> </div> </div> </div> </body> </html>