天天看点

Python-Django 静态文件的引入和配置(五)

django中引入静态配置文件

第二章 Python 引入自己的静态配置文件

前言

 本系列文章以一个简单的学校项目来做演示,项目中遇到的问题会一一记录下来,仅供学习参考使用

此处学习版本 python3.8 django 4.0.6 bootstrap3 开发工具 VSCODE

一、创建目录

首先,在你的 子项目中目录里创建一个 templates 目录。Django 将会在这个目录里查找模板文件。

项目目录结构:

school
    --school_env 虚拟环境目录
    --school_web 程序目录
    --school_web_grade 自己的项目目录
        --templates 页面存放地址
    --static 静态文件目录
    --db.sqlite3 数据库文件,此处以sqlite3为数据库进行演示
    --manage.py 主程序运行文件      
Python-Django 静态文件的引入和配置(五)

 static 目录存放 静态文件

二、静态文件存放文件夹配置

在 项目同目录中创建 static 文件夹 存放自己的静态文件,然后还需要增加配置 上边的配置文件已列出下面的配置

此配置的目的是为了匹配路径

# 别名
STATIC_URL = 'static/'
# statics配置的静态文件夹
STATICFILES_DIRS = [
   os.path.join(BASE_DIR,'static'),
]      
Python-Django 静态文件的引入和配置(五)

3.页面引用文件的方法

<meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <!-- 静态地址引入方式-->
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="/static/bootstrap-3.4.1/css/bootstrap.min.css" />
    <!-- 程序引入方式 -->
    <!-- 可选的 Bootstrap 主题文件(一般不用引入) -->
    <link rel="stylesheet" href="{% static 'bootstrap-3.4.1/css/bootstrap-theme.min.css' %}" />
    <script src="{% static 'js/jquery-3.2.1/jquery.min.js' %}"></script>
    <script src="{% static 'js/popper-1.15.0/umd/popper.min.js' %}"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="{% static 'bootstrap-3.4.1/js/bootstrap.min.js' %}"></script>
    <!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询(media queries)功能 -->
    <!-- 警告:通过 file:// 协议(就是直接将 html 页面拖拽到浏览器中)访问页面时 Respond.js 不起作用 -->
    <!-- HTML5 Shiv 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 -->
    <!--[if lt IE 9]>
         <script src="/static/js/html5shiv-3.7.0/html5shiv.js"></script>
         <script src="/static/js/respond-1.4.2/respond.min.js"></script>
      <![endif]-->      

总结

继续阅读