在网上看了很多说Django如何使用本地css/js的文章, 很多都是说的不是很清楚。

今天终于自己来验证一个能用的了, 记录下

在manager.py同层级下创建static文件夹, 里面放上css , js, image等文件或者文件夹

我的文件夹tree:

➜  FileService git:(master) ✗ tree
.
├── 2kill_port.sh
├── FileService
│   ├── __init__.py
│   ├── __pycache__
│   │   ├── __init__.cpython-37.pyc
│   │   ├── settings.cpython-37.pyc
│   │   ├── urls.cpython-37.pyc
│   │   └── wsgi.cpython-37.pyc
│   ├── settings.py
│   ├── urls.py
│   └── wsgi.py
├── db.sqlite3
├── en_bg.jpg
├── fileoperation
│   ├── __init__.py
│   ├── __pycache__
│   │   ├── __init__.cpython-37.pyc
│   │   ├── admin.cpython-37.pyc
│   │   ├── models.cpython-37.pyc
│   │   └── views.cpython-37.pyc
│   ├── admin.py
│   ├── apps.py
│   ├── migrations
│   │   ├── __init__.py
│   │   └── __pycache__
│   │   └── __init__.cpython-37.pyc
│   ├── models.py
│   ├── templates
│   │   ├── bg_homg.html
│   │   └── home.html
│   └── views.py
├── files
│   ├── 11.log
│   ├── 22.log
│   ├── 44.log
│   ├── th.jpeg
│   ├── �\217�\225快�\205�\ 2020-01-08\ �\213�\215\2101.50.03.png
│   └── �\235�\231��\212��\224\200�\207��\201.pdf
├── kill_port.sh
├── manage.py
└── static
├── images
│   └── en_bg.jpg
└── style
└── style.css

然后只需在FileService/settings.py中进行设置就行, 在末尾添加以下代码

STATIC_URL = '/static/'
STATICFILES_DIRS=[
os.path.join(BASE_DIR,'static')
]

最后只需要在使用的html文件中通过以下方式导入:

<head>

    <link rel="stylesheet" type="text/css" href="../static/style/style.css" />
<meta charset="UTF-8">
<title>文件传输</title> </head>

Django使用本地css/js文件的基本流程的更多相关文章

  1. Django使用本地css/js文件

    Django使用本地css/js文件 在manager.py同层级下创建static文件夹, 里面放上css , js, images等文件或者文件夹 我的文件夹层级 然后只需在settings.py ...

  2. js活jQuery实现动态添加、移除css/js文件

    下面是在项目中用到的,直接封装好的函数,拿去在js中直接调用就可以实现css.js文件的动态引入与删除.代码如下 动态加载,移除,替换css/js文件 // 动态添加css文件 function ad ...

  3. 在桌面右键创建html,css,js文件

    1.在开始里面输入regedit,进入注册表编辑器. 2.打开HKEY_CLASSES_ROOT项. 3.打开.html/.css/.js项. 4.右键新建项,起名ShellNew. 5.新建字符串值 ...

  4. jsp 引用css/js文件返回html网页问题

    我的问题: 我直接在web.xml中匹配了 “/” ,以为能默认使用 “localhost:8080/news/” 这种方式,直接进入首页. 但是这样会匹配所有url 因此请求的 ***.js/*** ...

  5. flask-bootstrap 模版中所需的CSS/JS文件实现本地引入

    Flask-Bootstrap默认是加载CDN的css与js文件,每次刷新页面都要访问到外网的cdn来获取css与js文件; 模版扩展来自于bootstrap/base.html,就以bootstra ...

  6. 引入其他服务的JS、和 本地的JS文件,script的属性

    ==============使用其他服务器引入JS文件,1,减轻服务器压力2,速度快3,可以缓存 cdnjs库,更新比较快https://cdnjs.com/ cdn库 引入JS文件如:jqueryb ...

  7. Boostrap本地导入js文件

    我一般都是用CDN直接导入的,但是有时候需要自己添加一些功能进入,会用到本地导入.关于导入路径问题,做个笔记. 使用HBuilder,首先右键导入相应的js/cs文件 然后是常规——>文件系统 ...

  8. 关于css js文件缓存问题

    什么情况下,要禁止静态文件缓存:1.经常可能要改动的 js, css.比如一个js文件引用如下<script src="test.js"></script> ...

  9. css,js文件后面加一个版本号

    由于前几天,更新了项目,更新的文件有js文件,今天客人截图过来,我发现修改之后的效果没有显示出来,我回复说清理浏览器缓存.到了晚上,客人找老板,说还没有处理到這个,说客人不懂這个.所以想到之前自己为了 ...

  10. vue中如何在本地导入js文件

    import {setStore,setUser,getStore,removeStore} from "../../../public/localstory" 在导入js文件时, ...

随机推荐

  1. SpringSecurity 的登录流程

    ​ 用过SpringSecurity的小伙伴,都知道 Authentication 这个接口,我们在任何地方通过这个接口来获取到用户登录的信息,而我们用的频繁的一个它的一个实现类就是 Username ...

  2. 基于OpenCV-Python的图像位置校正和版面分析

    前言 使用opencv对图像进行操作,要求:(1)定位银行票据的四条边,然后旋正.(2)根据版面分析,分割出小写金额区域. 图像校正 首先是对图像的校正 读取图片 对图片二值化 进行边缘检测 对边缘的 ...

  3. (数据科学学习手札158)基于martin为在线地图快速构建精灵图服务

    本文示例代码已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 大家好我是费老师,martin作为快速发展中的新 ...

  4. windows 激活工具

    https://files-cdn.cnblogs.com/files/del88/heukms.zip

  5. NC19999 [HAOI2016]放棋子

    题目链接 题目 题目描述 给你一个N*N的矩阵,每行有一个障碍,数据保证任意两个障碍不在同一行,任意两个障碍不在同一列,要求你在这个矩阵上放N枚棋子(障碍的位置不能放棋子),要求你放N个棋子也满足每行 ...

  6. Codeforces Round #824 (Div. 2) A-E

    比赛链接 A 题解 知识点:贪心,数学. 注意到三段工作时间一共 \(n-3\) 天,且天数实际上可以随意分配到任意一段,每段至少有一天,现在目的就是最大化段差最小值. 不妨设 \(l_1<l_ ...

  7. Python中用With open as 实现对文件的操作

    with open as f在Python中用来读写文件(夹). 基本写法如下: with open(文件名,模式)as f: f.write(内容)#写操作 例:with open ('这个文章.t ...

  8. Ubuntu在无网络环境下,用离线源apt-get安装软件

    步骤概要如下: 1.假设目标安装的是服务器A,需先准备一台正常环境,且操作系统版本与A一致的服务器B: 2.用apt-get在服务器B上下载需要安装的包,并用dpkg-scanpackages依赖打包 ...

  9. ORA-39087: Directory Name Is Invalid

    说明 有时我们在Oracle数据库服务器执行expdp/impdp过程中会碰到这个错误:ORA-39087: Directory Name Is Invalid,意思是我们指定的directory参数 ...

  10. 循环掌控:深入理解C语言循环结构,高效实现重复性任务

    欢迎大家来到贝蒂大讲堂 养成好习惯,先赞后看哦~ 所属专栏:C语言学习 贝蒂的主页:Betty's blog 引言 前面贝蒂带大家了解了选择结构,今天就来为大家介绍循环结构,也就是我们熟悉的while ...