您当前的位置:首页 > IT编程 > python
| C语言 | Java | VB | VC | python | Android | TensorFlow | C++ | oracle | 学术与代码 | cnn卷积神经网络 | gnn | 图像修复 | Keras | 数据集 | Neo4j | 自然语言处理 | 深度学习 | 医学CAD | 医学影像 | 超参数 | pointnet | pytorch | 异常检测 | Transformers | 情感分类 | 知识图谱 |

自学教程:Django零基础入门之静态文件的引用

51自学网 2021-10-30 22:14:23
  python
这篇教程Django零基础入门之静态文件的引用写得很实用,希望能帮到您。

引言:

在我们Django中如何引用三大静态文件(JavaScript,CSS,image)呢?
这就是本文要讲述的内容——静态文件的引用!

效果展示:

在这里插入图片描述

点击确定之后:

在这里插入图片描述

1.静态文件引用:

(1)创建静态文件目录:

在项目目录下创建static目录, 为了区分开各种类型的静态文件,再分别创建css,image,js文件目录:

在这里插入图片描述

(2)静态文件路径的配置:

在settings.py文件中添加STATICFILES_DIRS
设置静态文件目录路径,同templates设置。

(settings.py文件中加入下述代码即可!)

# 配置静态文件的路径       BASE_DIR是项目根目录STATICFILES_DIRS = [    os.path.join(BASE_DIR, "static")]

(3)创建三大静态文件:

1.JS——创建文件/static/js/index.js

在这里插入图片描述

2.CSS——创建文件/static/css/index.css:

在这里插入图片描述

3.image——创建文件/static/image/first.jpg:

在这里插入图片描述

总览:

在这里插入图片描述

(4)静态文件的引用:

{#静态文件的加载#}{% load static %}{#   注意::: {%  %}这是模板标签    #}<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>测试!</title>    {#css文件的引用#}    <link rel="stylesheet" href="{% static 'css/index.css' %}" rel="external nofollow" ></head><body>{#图片文件的引用#}<img src="{%  static 'image/first.jpg' %}" alt="">{#js文件的引用#}<script src="{% static 'js/index.js' %}"></script></body></html>

到此这篇关于Django零基础入门之静态文件的引用的文章就介绍到这了,更多相关Django静态文件内容请搜索51zixue.net以前的文章或继续浏览下面的相关文章希望大家以后多多支持51zixue.net!


Django零基础入门之常用过滤器详解
一篇文章彻底搞懂python正则表达式
万事OK自学网:51自学网_软件自学网_CAD自学网自学excel、自学PS、自学CAD、自学C语言、自学css3实例,是一个通过网络自主学习工作技能的自学平台,网友喜欢的软件自学网站。