這可能是一個愚蠢的問題。我是 django 的新手，我想知道當 css 在不同的檔案中時如何使用 css。
現在我的檔案路徑如下所示：
css: web/static/web/style.css Html: web/templates/web
我的 Html 檔案如下所示：
{% load static %}
<!--HTML-->
<body>
<div class="topnav">
<a class="active" href="/">Home</a>
<a href="/donate">Donate</a>
</div>
</body>
我的CSS看起來像這樣：
.topnav {
background-color: #333;
overflow: hidden;
}
.topnav a {
float: left;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
.topnav a:hover {
background-color: #ddd;
color: black;
}
.topnav a.active {
background-color: #04AA6D;
color: white;
}
如何讓 html 使用不同檔案中的 css？
uj5u.com熱心網友回復：
添加<head>…</head>標簽并<link rel="stylesheet" href="static/web/style.css"/>在<head>…</head>標簽內輸入。確保在標簽<head>…</head>之外。<body>…</body>這是新代碼。
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="static/web/style.css"/>
<!--other head contents like title and meta tag goes here-->
</head>
<!--HTML-->
<body>
<div class="topnav">
<a class="active" href="/">Home</a>
<a href="/donate">Donate</a>
</div>
</body>
</html>
uj5u.com熱心網友回復：
這種方法對我有用。
創建一個名為staticfiles的目錄，然后在該檔案夾中創建一個css目錄。
然后檢查 settings.py 檔案，使其看起來像這樣：
import os
PROJECT_DIR = os.path.dirname(__file__)
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.sqlite3',
'NAME': os.path.join(PROJECT_DIR, 'myweblabdev.sqlite'),
'USER': '',
'PASSWORD': '',
'HOST': '',
'PORT': '',
}
}
MEDIA_ROOT = os.path.join(PROJECT_DIR, 'media')
MEDIA_URL = '/media/'
STATIC_ROOT = os.path.join(PROJECT_DIR, 'static')
STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(PROJECT_DIR, 'staticfiles'),
然后轉到專案的主urls.py檔案并添加以下內容：
from django.conf.urls import patterns, include, url
from django.conf.urls.static import static
from django.contrib import admin
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from myweblab import settings
admin.autodiscover()
urlpatterns = patterns('',
.......
) static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
urlpatterns = staticfiles_urlpatterns()
然后在html檔案中，添加這個，它現在應該可以作業了：
{% load static %}
<link rel="stylesheet" href="{% static 'css/style.css' %}">
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/443701.html
上一篇：bootstrap水平對齊元素
下一篇：如何更改按鈕元素的顏色？