制作首页的显示列表
1.在首页添加显示问答的列表，并定义好相应的样式。
无序列表
<ul >
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
html代码
1 <div class="context"> 2 <div class="index index-left"></div> 3 <div class="index index-center"> 4 <div class="picture"> 5 <img src="{{ url_for('static', filename='img/index_p1.png') }}" width="100%"/> 6 </div> 7 <br><br> 8 <div class="index-question"> 9 <div class="question-left"> 10 <ul> 11 <li> 12 <div class="item-one"> 13 <div class="author"> 14 <a class="avatar" target="_blank" href="/u/ccd1daeaf7c7"> 15 <img src="//upload.jianshu.io/users/upload_avatars/5620173/edaa35fa-f937-4e57-9c19-6a94e951529d.jpg?imageMogr2/auto-orient/strip|imageView2/1/w/64/h/64" 16 alt="64"> 17 </a> 18 <div class="info"> 19 <a class="nickname" target="_blank" href="/u/ccd1daeaf7c7">赵苏七sukie</a> 20 <span class="time">5小时前</span> 21 </div> 22 </div> 23 <div class="title"> 24 <a target="_blank" 25 href="/p/f24a71ecb5f5">我是男性，假如我在泰坦尼克号上，我不会让妇女先走</a> 26 </div> 27 <div class="abstract"> 28 <p> 29 最近一个很火的社区出了一篇帖子，发帖者是一位男性。 30 他说，每次看泰坦尼克号上让妇女小孩先走类似的情节，我都很郁闷。凭什么男人就该死？我宁愿抓阄，公平。要不就让头等舱先走，毕竟... 31 </p> 32 </div> 33 <div class="meta"> 34 <a class="collection-tag" target="_blank" href="/c/20f7f4031550">社会热点</a> 35 <a target="_blank" href="/p/f24a71ecb5f5"> 36 <span> 浏览： 4462</span> 37 </a> 38 <a target="_blank" href="/p/f24a71ecb5f5#comments"> 39 <span> 评论： 101</span> 40 </a> 41 <span> 点赞： 134</span> 42 </div> 43 </div> 44 </li> 45 <li> 46 <div class="item-one"> 47 <div class="author"> 48 <a class="avatar" target="_blank" href="/u/ccd1daeaf7c7"> 49 <img src="//upload.jianshu.io/users/upload_avatars/5620173/edaa35fa-f937-4e57-9c19-6a94e951529d.jpg?imageMogr2/auto-orient/strip|imageView2/1/w/64/h/64" 50 alt="64"> 51 </a> 52 <div class="info"> 53 <a class="nickname" target="_blank" href="/u/ccd1daeaf7c7">赵苏七sukie</a> 54 <span class="time">5小时前</span> 55 </div> 56 </div> 57 <div class="title"> 58 <a target="_blank" 59 href="/p/f24a71ecb5f5">我是男性，假如我在泰坦尼克号上，我不会让妇女先走</a> 60 </div> 61 <div class="abstract"> 62 <p> 63 最近一个很火的社区出了一篇帖子，发帖者是一位男性。 64 他说，每次看泰坦尼克号上让妇女小孩先走类似的情节，我都很郁闷。凭什么男人就该死？我宁愿抓阄，公平。要不就让头等舱先走，毕竟... 65 </p> 66 </div> 67 <div class="meta"> 68 <a class="collection-tag" target="_blank" href="/c/20f7f4031550">社会热点</a> 69 <a target="_blank" href="/p/f24a71ecb5f5"> 70 <span> 浏览： 4462</span> 71 </a> 72 <a target="_blank" href="/p/f24a71ecb5f5#comments"> 73 <span> 评论： 101</span> 74 </a> 75 <span> 点赞： 134</span> 76 </div> 77 </div> 78 </li> 79 </ul> 80 </div> 81 <div class="question-right"> 82 <div class="picture"> 83 <img src="{{ url_for('static', filename='img/index_p2.png') }}" width="100%"/> 84 </div> 85 <div class="picture"> 86 <img src="{{ url_for('static', filename='img/index_p3.png') }}" width="100%"/> 87 </div> 88 </div> 89 </div> 90 </div> 91 <div class="index index-right"></div> 92 </div>
2. 用字典向index.html传递参数。
python代码：
1 @app.route('/',methods=['GET','POST']) 2 def index(): 3 context = { 4 'userName' : "AllianceHacker", 5 'toTime' : '11小时前', 6 'title' : 'PHP是世界是最好的语言', 7 'context' : 'PHP是世界是最好的语言,这是一个不需要有疑问的问题，谁不服可以来战啊！！！' 8 } 9 return render_template('home.html',**context)
运行截图：