首頁文章已經布局完成,這次要完成的功能是點擊文章,跳轉到文章詳情頁.
新建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>

總結

以上是生活随笔為你收集整理的Flask实战2问答平台-问答详情完成的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。