制作首页的显示列表

Posted 2020-10-16 林丹宜

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了制作首页的显示列表相关的知识，希望对你有一定的参考价值。

1. 在首页添加显示问答的列表，并定义好相应的样式。

无序列表

<ul >

<li>Coffee</li>

</ul>

{% extends \'base.html\' %}
{% block title %}
    首页
{% endblock %}
{% block head %}
    <link type="text/css" rel="stylesheet" href="{{ url_for(\'static\',filename=\'css/index.css\') }}">

{% endblock %}
{% block main %}

<body>
   <div id="list">
       <ul class="list1" >
           <img src="../static/images/myself.jpg" width="60" height="60">
           <li class="zero">用户名:{{ user }}</li>
           <li class="one">问题:{{ question }}</li>
           <li class="two">回答:{{ answer }}</li>

       </ul>
   </div>

</body>
{% endblock %}

.list1{
    margin-top: 50px;
    margin-left: 50px;
    margin-right: 50px;
    width:500px;
    height:200px;
    background-color:azure;
    box-shadow: 10px 10px 5px #888888;
    border:2px solid antiquewhite;
    padding:20px 40px 20px 40px;
    border-radius:25px;
    list-style: none;


}
.zero{
    font-family: FZshuti;
    font-size: 15px;
    color: sandybrown;
}
.one{
    border:1px solid ;
    border-color: aquamarine;
    font-family: FZshuti;
    font-size: 15px;
    color: sandybrown;
}
.two{
    border: 1px dashed;
    border-color: aquamarine;
    height: 80px;
    font-family: FZshuti;
    font-size: 15px;
    color: sandybrown;
}

2. 用字典向index.html传递参数。

@app.route(\'/index\')
def index():
    context={
        \'user\':\'Lindan\',
        \'question\':\'1+1=？\',
        \'answer\':\'2\'
    }
    return render_template(\'index.html\',**context)

以上是关于制作首页的显示列表的主要内容，如果未能解决你的问题，请参考以下文章

制作首页的显示列表。

制作首页的显示列表