Django模版

django-bootstaps3

  • 什么是bootstaps

    是前端架构,是一款css/html框架,是将 BootStrap3(3 表示版本号)集成到 Django 中,作为 Django 的一个应用提供。 

    这样做的好处是在 Django 中用 bootstrap 会更加方便

  • 安装Django-bootstrap3

    python3 -m pip install django-bootstrap3
  • 添加应用

    在/guest/settings.py

Django模版

 

 

发布会列表

  • 写一个展示发布会列表的页面

  • H5的知识
    1.div是分割页面的块级元素,在div块内可以单独设置属性(颜色排列等,不影响块外的)

  • 在views中创建获取发布会的函数

    from sign.models import Event,Guest def event_manage(request):
         username=request.session.get('user','')#读取浏览器cookie
         event_list=Event.object.all()
         return render(request,"event_manage.html",{'user':username,'events':event_list})

  • 在urls中添加

    path('event_manage/',views.event_manage)

  • 在templates,修改event_manage.html

    <html lang="zh-CN">
        <head>
            {%load bootstrap3%}
            {%bootstrap_css%}
            {%bootstrap_javascript%}
            <title>Guest Manage</title>
        </head>
    <boby role="document">
        <!-- 导航栏 -->
        <nav class="navbar navbar-inverse navbar-fixed-top">     <div class="navbar-header"> 
             <a class="navbar-brand" href="/event_manage/">Guest Manage System</a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
            <ul class="nav navbar-nav">
           <li class="active"><a href="#">发布会</a></li>         <li><a href="/guest_manage/">嘉宾</a></li>
            </ul>
        <ul class="nav navbar-nav navbar-right">     <li><a href="#">{{user}}</a></li>      <li><a href="/logout/">退出</a></li>
      </ul>
      </div>
    </nav>
    <!-- 发布会列表 -->
    <div class="row" style="padding-top: 80px;">
      <div class="col-md-6">
         <table class="table table-striped">
    <thead> <tr>      <th>id</th><th>名称</th><th>状态</th><th>地址</th><th>时间</th>
    </tr>
    </thead>
    <tbody>  {% for event in events %}  <tr>       <td>{{ event.id }}</td>       <td>{{ event.name }}</td>       <td>{{ event.status }}</td>       <td>{{ event.address }}</td>       <td>{{ event.start_time }}</td>  </tr>
            {% endfor %}       </tbody>     </table>   </div>  </div>  </body>  </html>
    对于 BootStrap 框架来说,它主要通过 class 属性来设置 HTML 标签的样式。
    {% load bootstrap3 %}  {% bootstrap_css %}  {% bootstrap_javascript %}  加载 Bootstrap3 应用,CSS 和 JavaScript 文件。{% %}为 Django 的模板标签,Django 的模板语言将会  在该标签下编写。
    <title>Guest Manage</title>  设置页面标题为 Guest Manage。
    <li class="active"><a href="#">发布会</a></li>  <li><a href="/guest_manage/">嘉宾</a></li>






 

上一篇:KVM中断虚拟化(一)


下一篇:吴恩达《卷积神经网络》