制作首页的显示列表。

1. 在首页添加显示问答的列表，并定义好相应的样式。
无序列表
<ul >
<li>Coffee</li>
</ul>
2. 用字典向index.html传递参数。
html:
{% extends'base.html' %}
{% block title %}
    首页
{% endblock %}
{% block head %}
    <link rel="stylesheet" href="{{ url_for('static',filename='css/index.css') }}" type="text/css">
{% endblock %}
{% block main %}
    <body id="myBody">
    <div class="indexone">
        <ul>
            <li>
                <div class="author">
                    <a class="nickname" href="http://www.mafengwo.cn/u/80594779.html">启蒙高小五</a>
                    <span class="time">5小时前</span>
                </div>
                <div class="title">
                    <p class="wenzi">
                        完全是误打误撞去的。也算是当地特色。不过奇怪的是，大家全都热衷买外卖，并没有多少进店吃的。蟹黄小笼包貌似特别有名，不过对于海鲜没兴趣的我，并没有吃。点了素烧卖、大馒头、臭豆腐，每菜都有自己的味道，挺不错的。
                    </p>

                    {#                    <div>#}
                    {#                        <span>#}
                    {#                        <a href="/photo/poi/3849750_163881703.html">#}
                    {#                            <img src="http://n2-q.mafengwo.net/s10/M00/C1/E4/wKgBZ1n_4TGAaknOAAJr7K0y9CM78.jpeg?imageMogr2%2Fthumbnail%2F%21200x150r%2Fgravity%2FCenter%2Fcrop%2F%21200x150%2Fquality%2F90"#}
                    {#                                 width="100" height="118">#}
                    {#                        </a>#}
                    {#                            </span>#}
                    {#                        <span>#}
                    {#                        <a href="/photo/poi/3849750_163881706.html">#}
                    {#                            <img src="http://p4-q.mafengwo.net/s10/M00/C1/D0/wKgBZ1n_4QWAAT2BAAIRhFSuXAY33.jpeg?imageMogr2%2Fthumbnail%2F%21200x150r%2Fgravity%2FCenter%2Fcrop%2F%21200x150%2Fquality%2F90"#}
                    {#                                 width="100" height="118">#}
                    {#                        </a>#}
                    {#                            </span>#}
                    {#                        <span>#}
                    {#                        <a href="/photo/poi/3849750_163881709.html">#}
                    {#                            <img src="http://b1-q.mafengwo.net/s10/M00/C1/B7/wKgBZ1n_4NqATBAQAAHpU65QXQQ76.jpeg?imageMogr2%2Fthumbnail%2F%21200x150r%2Fgravity%2FCenter%2Fcrop%2F%21200x150%2Fquality%2F90"#}
                    {#                                 width="100" height="118">#}
                    {#                        </a>#}
                    {#                            </span>#}
                    {#                    </div>#}
                    <div class="meta">
                        <a class="collection-tag">
                            <span style="font-family: 幼圆">社会热点</span>
                        </a>
                        <a class="collection-tag">
                            <span style="font-family: 幼圆">　浏览： </span><span
                                style="font-family: 幼圆;color: red">　888 </span>
                        </a>
                        <a class="collection-tag">
                            <span style="font-family: 幼圆">　评论： </span><span
                                style="font-family: 幼圆;color: red">　1000 </span>
                        </a>
                        <span style="font-family: 幼圆">　点赞： </span><span
                            style="font-family: 幼圆;color: red">　1000 </span>
                    </div>

                </div>
            </li>

            <li>
                <span class="glyphicon glyphicon-leaf" aria-hidden="true"></span>
                <a href="#">username</a>
                <br>
                <a href="#">title</a><br>
                <span class="badges">creat_time</span>
                <p>detail{{ detail }}</p>

            </li>
        </ul>
    </div>

    </body>
    </html>
{% endblock %}
python:
结果：
posted @ 2017-12-01 14:13 089江芷璇阅读(195) 评论(0) 收藏举报
刷新页面返回顶部