ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Django模版

2021-10-29 10:32:15  阅读:203  来源: 互联网

标签:bootstrap Guest 模版 manage Django Manage event


django-bootstaps3

  • 什么是bootstaps

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

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

  • 安装Django-bootstrap3

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

    在/guest/settings.py

 

 

发布会列表

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

  • 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>






 

标签:bootstrap,Guest,模版,manage,Django,Manage,event
来源: https://www.cnblogs.com/zhifeiji822/p/15479185.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有