网站搭建-django-学习成绩管理-12-卡片

{% load staticfiles %}
<meta charset="utf-8"></meta>
<meta content="width=device-width,initial-scale=1,shrink-to-fit=no" name="viewport"></meta>
<title>成绩查询</title>
<style>
    .table-center{
        text-align: center;
        vertical-align: middle;
        white-space: wrap;
    }
</style>
<link href="/static/pic/favicon.ico" rel="shortcut icon"></link>
<link href="{% static 'font_awesome/css/font-awesome.min.css' %}" rel="stylesheet" type="text/css"></link>
<link href="{% static 'bootstrap/css/bootstrap.css' %}" rel="stylesheet" type="text/css"></link>
<link href="{% static 'datatables/css/jquery.dataTables.css' %}" rel="stylesheet" type="text/css"></link>
<link href="{% static 'datatables/css/buttons.dataTables.min.css' %}" rel="stylesheet" type="text/css"></link>
<link href="{% static 'datatables/css/select.dataTables.min.css' %}" rel="stylesheet" type="text/css"></link>
<link href="{% static 'datatables/css/dataTables.checkboxes.css' %}" rel="stylesheet" type="text/css"></link>
<br></br>
<div class="card">
    <div class="card-header">
        学生成绩查询
        <i class="fa fa-search"></i>
    </div>
    <div class="card-body">
        班级
        {% for class_name in all_class_name %}
            {{ class_name }}
        {% endfor %}
        <br></br>
        学生姓名
        {% for student_name in all_student_name %}
            {{ student_name }}
        {% endfor %}
        <br></br>
        课程名称
        {% for course_name in all_course_name %}
            {{ course_name }}
        {% endfor %}
        <br></br>
        第几次模拟考
        {% for exam_info in all_exam_info %}
            {{ exam_info }}
        {% endfor %}
        <br></br>
        <button type="button" class="btn btn-primary">查询</button>
    </div>
</div>
<br></br>
<div class="card">
    <div class="card-header">
        查询结果
    </div>
    <div class="card-body">
        <table class="table table-condensed table-hover" id="table-query" style="table-layout:auto" width="100%">
            <thead class="thead-light">
                <tr id="tr-th" style="text-align: center;font-size:12px">
                    <th>班级</th>
                    <th>学生姓名</th>
                    <th>第几次模拟考</th>
                    <th>课程名称</th>
                    <th>成绩</th>
                </tr>
            </thead>
            <tbody></tbody>
        </table>
    </div>
</div>
<br></br>

<div class="card">
    <div class="card-header">
        查询条件
        <i class="fa fa-search"></i>
    </div>
    <div class="card-body">
        <!-- 具体内容 -->
    </div>
</div>

style

<div class="card" style="background-color: #f8f9fa;">
    <!-- 卡片内容 -->
</div>

<link href="/static/pic/favicon.ico" rel="shortcut icon"></link>