Django零基礎(chǔ)入門之靜態(tài)文件的引用
引言:
在我們Django中如何引用三大靜態(tài)文件(JavaScript,CSS,image)呢?
這就是本文要講述的內(nèi)容——靜態(tài)文件的引用!
效果展示:

點(diǎn)擊確定之后:

1.靜態(tài)文件引用:
(1)創(chuàng)建靜態(tài)文件目錄:
在項(xiàng)目目錄下創(chuàng)建static目錄, 為了區(qū)分開各種類型的靜態(tài)文件,再分別創(chuàng)建css,image,js文件目錄:

(2)靜態(tài)文件路徑的配置:
在settings.py文件中添加STATICFILES_DIRS
設(shè)置靜態(tài)文件目錄路徑,同templates設(shè)置。
(settings.py文件中加入下述代碼即可?。?/em>
# 配置靜態(tài)文件的路徑 BASE_DIR是項(xiàng)目根目錄
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static")
]
(3)創(chuàng)建三大靜態(tài)文件:
1.JS——?jiǎng)?chuàng)建文件/static/js/index.js

2.CSS——?jiǎng)?chuàng)建文件/static/css/index.css:

3.image——?jiǎng)?chuàng)建文件/static/image/first.jpg:

總覽:

(4)靜態(tài)文件的引用:
{#靜態(tài)文件的加載#}
{% load static %}
{# 注意::: {% %}這是模板標(biāo)簽 #}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>測(cè)試!</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>
到此這篇關(guān)于Django零基礎(chǔ)入門之靜態(tài)文件的引用的文章就介紹到這了,更多相關(guān)Django靜態(tài)文件內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
從零學(xué)python系列之?dāng)?shù)據(jù)處理編程實(shí)例(一)
本文目的:用一個(gè)實(shí)例總結(jié)學(xué)習(xí)到的with語句,函數(shù),列表推導(dǎo),集合,排序,字符分割等內(nèi)容2014-05-05
對(duì)python 讀取線的shp文件實(shí)例詳解
今天小編就為大家分享一篇對(duì)python 讀取線的shp文件實(shí)例詳解,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-12-12
pycharm上的python虛擬環(huán)境移到離線機(jī)器上的方法步驟
本人在工作中需要在離線Windows環(huán)境中使用,本文主要介紹了pycharm上的python虛擬環(huán)境移到離線機(jī)器上的方法步驟,具有一定的參考價(jià)值,感興趣的可以了解一下2021-10-10
django中的數(shù)據(jù)庫遷移的實(shí)現(xiàn)
這篇文章主要介紹了django中的數(shù)據(jù)庫遷移的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-03-03
python從網(wǎng)絡(luò)讀取圖片并直接進(jìn)行處理的方法
這篇文章主要介紹了python從網(wǎng)絡(luò)讀取圖片并直接進(jìn)行處理的方法,涉及cStringIO模塊模擬本地文件的使用技巧,需要的朋友可以參考下2015-05-05
使用Python 統(tǒng)計(jì)高頻字?jǐn)?shù)的方法
今天小編就為大家分享一篇使用Python 統(tǒng)計(jì)高頻字?jǐn)?shù)的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-01-01

