我在將 CSS 鏈接到 HTML 頁面時遇到問題。兩個文件都在同一個目錄中，但是當我在 Chrome 的本地端口上運行時，我在終端中得到了這個文件（“test3”是 html 文件）：Not Found: /test3/sidebar.css[15/Apr/2020 17:57:52] "GET /test3/sidebar.css HTTP/1.1" 404 8233無論我如何更改 href 路徑，除非我包含目錄名：css 文件名，否則此問題都會出現一些變化，但即使如此，HTML 文件也不會繼承 CSS 樣式。我正在開發側邊欄導航，這就是為什么名稱是這樣的，但我只是包含了我在下面使用的測試線：.html 文件：<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Testang</title> <link rel="stylesheet" href="https://getbootstrap.com/docs/4.0/dist/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> <link href="sidebar.css" rel="stylesheet" type="text/css"></head><body><h1> Test </h1></body></html>如果我輸入 href 像<link href="requests:sidebar.css" rel="stylesheet" type="text/css"> 我沒有收到錯誤，但仍然沒有看到 CSS 更改（“requests”是目錄的名稱）。.css 文件：h1 { color: red; font-size: 50px;}我剛剛從 PyCharm 切換過來。設置 Atom 后，我從 PyCharm 文件夾中打開 Atom 中的項目。其他一切似乎都工作正常。
4 回答
達令說
TA貢獻1821條經驗 獲得超6個贊
在 HTML 文件的開頭添加：
{% load static %}并改變
<link href="sidebar.css" rel="stylesheet" type="text/css">
像這樣的事情：
<link href="{% static 'sidebar.css' %}" rel="stylesheet" type="text/css">
小唯快跑啊
TA貢獻1863條經驗 獲得超2個贊
由于 CSS 文件位于同一文件夾中，您可以嘗試如下操作：
<link href="./sidebar.css" rel="stylesheet" type="text/css">
點告訴瀏覽器在與 HTML 相同的文件夾中進行搜索。
滄海一幻覺
TA貢獻1824條經驗 獲得超5個贊
代碼看起來不錯，沒有錯別字。確保 CSS 文件和 HTML 文件位于同一文件夾中，并且它們不是文本文件并且具有擴展名，當然，文件已保存。
test3是父目錄嗎？
它只是 HTML 和 CSS 還是一個 Django 項目？
森林海
TA貢獻2011條經驗 獲得超2個贊
我在主項目目錄中創建了一個名為“static”的文件夾，然后在其中創建了一個名為“css”的目錄。然后，這是我所缺少的一件大事，進入項目的 settings.py 并創建STATICFILES_DIRS該新文件夾的路徑。
根據我所讀到的內容，當我將其投入生產時，我需要一些額外的工作。
# Static files (CSS, JavaScript, Images)
https://docs.djangoproject.com/en/3.0/howto/static-files/
STATIC_URL = '/static/'
STATICFILES_DIRS = [
"full folder path to static folder"
]
然后在 HTML 文件中輸入：
{% load static %}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Test</title>
<link rel="stylesheet" href="https://getbootstrap.com/docs/4.0/dist/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="{% static 'css/sidebar.css' %}">
</head>
關鍵部分是load static頂部的 和 href to {% static 'css/sidebar.css' %}。
- 4 回答
- 0 關注
- 222 瀏覽
添加回答
舉報
0/150
提交
取消