目錄
- 效果展示：
- 1.靜態文件引用：
- （1）創建靜態文件目錄：
- （2）靜態文件路徑的配置：
- （3）創建三大靜態文件：
- （4）靜態文件的引用：
引言：
在我們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靜態文件內容請搜索腳本之家以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持腳本之家！
您可能感興趣的文章:- Django實現靜態文件緩存到云服務的操作方法
- Django靜態文件加載失敗解決方案
- 快速解決Django關閉Debug模式無法加載media圖片與static靜態文件
- Django添加bootstrap框架時無法加載靜態文件的解決方式
- django配置app中的靜態文件步驟
- 如何分離django中的媒體、靜態文件和網頁
