首页文章已经布局完成,这次要完成的功能是点击文章,跳转到文章详情页. 新建detail.html
{% extends 'base.html' %} {% block title %}详情{% endblock %} {% block head %}<link rel="stylesheet" href="{{url_for('static',filename = 'css/detail.css')}}"> {% endblock %} {% block main %} <div class="container"> <h3 class="page-title">{{question.title}}</h3> <p class="question-info"> <span>{{question.author.username}}</span> <span>{{question.create_time}}</span> </p> <hr> <p class="question-content">{{question.content}}</p> <hr> <h4>评论:(0)</h4> <form action="#" method="post"> <div class="form-group"> <input name="answer_content" type="text" class="form-control" placeholder="请填写评论"> </div> <div class="form-group" > <button class="btn btn-primary">立即评论</button> </div> </form> </div> {% endblock %}detail.css
.question-info{ text-align: center; margin-top: 20px; } .container{ margin: 0; width: auto; } .form-group{ text-align: right; }然后我们在index.html中添加跳转链接,这样就实现从图一跳转到图二
<p class="question-title"><a href="{{url_for('detail',question_id = question.id)}}">{{question.title}}</a></p>