做一家购物网站要多少钱,电子商务网络营销的概念,网站开发价格,wordpress发布活动下面#xff0c;我们正式开始XX市第X医院员工信息管理系统的开发
首先#xff0c;我们项目的目录结构如下#xff1a; 然后#xff0c;先把模板【base.html】界面的框架搭起来
{% load static %}!DOCTYPE html
html langenheadm…下面我们正式开始XX市第X医院员工信息管理系统的开发
首先我们项目的目录结构如下 然后先把模板【base.html】界面的框架搭起来
{% load static %}!DOCTYPE html
html langenheadmeta charsetUTF-8title模板页面/title!--引入路径app01/static/plugin/bootstrap-3.4.1-dist/css/下的bootstrap.min.css--link relstylesheet href{% static /plugin/bootstrap-3.4.1-dist/css/bootstrap.min.css %}{% block css %}{% endblock %}
/head
bodydiv{% block content %}{% endblock %}/div
!--引入路径app01/static/plugin/other_js/下的jquery-3.6.0.min.js--
script src{% static /plugin/other_js/jquery-3.6.0.min.js %}/script
!--引入路径app01/static/plugin/bootstrap-3.4.1-dist/js/下的bootstrap.min.js--
script src{% static /plugin/bootstrap-3.4.1-dist/js/bootstrap.min.js %}/script{% block js %}{% endblock %}/body
/html
然后从bootstrap官网上找个导航栏直接拿过来改改放在body里 nav classnavbar navbar-defaultdiv classcontainer-fluid!-- Brand and toggle get grouped for better mobile display --div classnavbar-headerbutton typebutton classnavbar-toggle collapsed data-togglecollapsedata-target#bs-example-navbar-collapse-1 aria-expandedfalsespan classsr-onlyToggle navigation/spanspan classicon-bar/spanspan classicon-bar/spanspan classicon-bar/span/buttona classnavbar-brand href#XX市第X人民医院/a/div!-- Collect the nav links, forms, and other content for toggling --div classcollapse navbar-collapse idbs-example-navbar-collapse-1ul classnav navbar-navli classactivea href#部门管理/a/li/ulul classnav navbar-nav navbar-rightlia href#登录/a/lilia href#注册/a/lili classdropdowna href# classdropdown-toggle data-toggledropdown rolebutton aria-haspopuptruearia-expandedfalseDropdown span classcaret/span/aul classdropdown-menulia href#Action/a/lilia href#Another action/a/lilia href#Something else here/a/lili roleseparator classdivider/lilia href#Separated link/a/li/ul/li/ul/div!-- /.navbar-collapse --/div!-- /.container-fluid --
/nav
完整代码如下
{% load static %}!DOCTYPE html
html langenheadmeta charsetUTF-8title模板页面/title!--引入路径app01/static/plugin/bootstrap-3.4.1-dist/css/下的bootstrap.min.css--link relstylesheet href{% static /plugin/bootstrap-3.4.1-dist/css/bootstrap.min.css %}{% block css %}{% endblock %}
/head
bodynav classnavbar navbar-defaultdiv classcontainer-fluid!-- Brand and toggle get grouped for better mobile display --div classnavbar-headerbutton typebutton classnavbar-toggle collapsed data-togglecollapsedata-target#bs-example-navbar-collapse-1 aria-expandedfalsespan classsr-onlyToggle navigation/spanspan classicon-bar/spanspan classicon-bar/spanspan classicon-bar/span/buttona classnavbar-brand href#XX市第X人民医院/a/div!-- Collect the nav links, forms, and other content for toggling --div classcollapse navbar-collapse idbs-example-navbar-collapse-1ul classnav navbar-navli classactivea href#部门管理/a/li/ulul classnav navbar-nav navbar-rightlia href#登录/a/lilia href#注册/a/lili classdropdowna href# classdropdown-toggle data-toggledropdown rolebutton aria-haspopuptruearia-expandedfalseDropdown span classcaret/span/aul classdropdown-menulia href#Action/a/lilia href#Another action/a/lilia href#Something else here/a/lili roleseparator classdivider/lilia href#Separated link/a/li/ul/li/ul/div!-- /.navbar-collapse --/div!-- /.container-fluid --
/navdiv{% block content %}{% endblock %}/div
!--引入路径app01/static/plugin/other_js/下的jquery-3.6.0.min.js--
script src{% static /plugin/other_js/jquery-3.6.0.min.js %}/script
!--引入路径app01/static/plugin/bootstrap-3.4.1-dist/js/下的bootstrap.min.js--
script src{% static /plugin/bootstrap-3.4.1-dist/js/bootstrap.min.js %}/script{% block js %}{% endblock %}/body
/html
效果如下 后面涉及到其他功能我们只需要在导航栏上新增即可。
