天天看點

編寫你的第一個Django應用程式 六第6部分

第6部分

本教程從教程5停止的地方開始。我們已經建構了一個經過測試的Web輪詢應用程式,現在我們将添加樣式表和圖像。

除了伺服器生成的HTML之外,Web應用程式通常還需要提供呈現完整網頁所需的其他檔案(如圖像,JavaScript或CSS)。在Django中,我們将這些檔案稱為“靜态檔案”。

對于小型項目,這不是什麼大問題,因為您可以将靜态檔案儲存在Web伺服器可以找到的位置。但是,在更大的項目中 - 特别是那些由多個應用程式組成的項目 - 處理每個應用程式提供的多組靜态檔案開始變得棘手。

這django.contrib.staticfiles就是:它從您的每個應用程式(以及您指定的任何其他位置)收集靜态檔案到一個可以在生産中輕松提供的位置。

自定義應用程式的外觀

首先,建立目錄中調用static的polls目錄。Django會在那裡查找靜态檔案,類似于Django在其中找到模闆的方式polls/templates/。

Django的STATICFILES_FINDERS設定包含一個知道如何從各種來源發現靜态檔案的查找器清單。其中一個預設值是AppDirectoriesFinder查找每個中的“靜态”子目錄 INSTALLED_APPS,就像polls我們剛剛建立的那個。管理站點對其靜态檔案使用相同的目錄結構。

在static剛剛建立的目錄中,建立另一個名為的目錄,polls并在其中建立一個名為的檔案style.css。換句話說,你的樣式表應該是polls/static/polls/style.css。由于AppDirectoriesFinder靜态檔案查找器的工作原理,您可以簡單地在Django中引用此靜态檔案polls/style.css,類似于引用模闆路徑的方式。

将以下代碼放在該stylesheet(polls/static/polls/style.css)中:

編寫你的第一個Django應用程式 六第6部分

接下來,在頂部添加以下内容polls/templates/polls/index.html:

編寫你的第一個Django應用程式 六第6部分

該模闆标簽生成靜态檔案的絕對路徑。{% static %}

這就是開發所需要做的一切。

啟動伺服器(如果已經運作,則重新啟動它):

編寫你的第一個Django應用程式 六第6部分

重新加載http://localhost:8000/polls/,您應該看到問題連結是綠色(Django樣式!),這意味着您的樣式表已正确加載。

添加背景圖像

接下來,我們将為圖像建立一個子目錄。images在polls/static/polls/目錄中建立一個子目錄。在此目錄中,放置一個名為的圖像background.gif。換句話說,把你的形象放進去 polls/static/polls/images/background.gif。

然後,添加到stylesheet(polls/static/polls/style.css):

編寫你的第一個Django應用程式 六第6部分

重新加載http://localhost:8000/polls/,您應該看到螢幕左上角加載了背景。

編寫你的第一個Django應用程式 六第6部分

這些是基礎知識。有關架構中包含的設定和其他位的更多詳細資訊,請參閱 靜态檔案howto和 staticfiles引用。部署靜态檔案讨論了如何在真實伺服器上使用靜态檔案。