為什麼我的 Flask 應用程式沒有載入我的 CSS 檔案？

應用程式未擷取.css 檔案：修改Flask 檔案結構指南

在Flask 應用程式中設定外部樣式表的樣式時，它有必要適當地建立文件以確保成功應用樣式。如果未套用樣式，則可能需要調整檔案結構。

在給定的範例中，外部樣式表位於 /styles/mainpage.css，而 HTML 範本嘗試載入它來自../styles/mainpage.css。這個不正確的路徑可能會導致樣式不套用。

要解決此問題，應修改檔案結構以將樣式表放置在應用程式的「靜態」資料夾中。更新後的檔案結構應如下所示：

/app
    - app_runner.py
    /services
        - app.py 
    /templates
        - mainpage.html
    /static
        /styles
            - mainpage.css

接下來，應調整HTML 範本以正確載入CSS 檔案：

<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles/mainpage.css') }}">

此修改後的HTML 程式碼使用url_for 函數動態產生CSS 檔案的正確URL，確保Flask 可以在「static」資料夾中找到它。實施這些變更後，外部樣式現在應該套用於渲染的範本。

以上是為什麼我的 Flask 應用程式沒有載入我的 CSS 檔案？的詳細內容。更多資訊請關注PHP中文網其他相關文章！