python - Django：CSS 不工作

Question

我还是 django 的新手，我的 CSS 工作有问题。
我遵循了链接中的指示：Django Static Link tutorial，关于处理静态文件。但它仍然无法正常工作。

设置

# Absolute path to the directory static files should be collected to.
# Don't put anything in this directory yourself; store your static files
# in apps' "static/" subdirectories and in STATICFILES_DIRS.
# Example: "/home/media/media.lawrence.com/static/"
STATIC_ROOT = '/Users/a9austin/Development/sites/AlphaSocks/src/static_root/'

# URL prefix for static files.
# Example: "http://media.lawrence.com/static/"
STATIC_URL = '/static/'

# Additional locations of static files
STATICFILES_DIRS = (
# Put strings here, like "/home/html/static" or "C:/www/django/static".
# Always use forward slashes, even on Windows.
# Don't forget to use absolute paths, not relative paths.
'/Users/a9austin/Development/sites/AlphaSocks/src/staticfiles'

)

看法

#from django.http import HttpResponse
from django.shortcuts import render_to_response


def index(request):
return render_to_response('index.html')

索引.html

<link rel="stylesheet" href="{{STATIC_URL}}css/style.css" type="text/css" media="screen" >

和目录组织

src->staticfiles->css->style.css

非常感谢您，非常感谢您的帮助和时间！

score 49 · Accepted Answer

要让 Django 提供静态文件，您必须确保有几个设置。

STATIC_URL

此设置指定静态文件应映射到的 url。你已经完成了。

STATICFILES_DIRS

这指定了 Django 应该在其中查找静态文件的系统上的所有文件夹。这个想法是您的项目中可能有几个应用程序，每个应用程序可能需要一组不同的静态文件。因此，出于组织目的，每个应用程序可能包含一个static目录，它将仅存储它的静态文件。所以 Django 必须有办法知道这些目录在哪里。这就是此设置的用途。

静态根

此设置指定 Django 将所有静态文件复制到哪里，而不是静态文件已经在哪里。这个想法是，一旦你将开发投入生产，Django 就不能再提供静态文件了，因为我不会去这里（它在文章中）。但是对于生产来说，所有静态文件都应该在一个目录中，而不是像在STATICFILES_DIRS. STATICFILES_DIRS因此，此设置指定一个目录，Django 将通过运行以下命令从其中的所有文件中复制所有静态文件到该目录：

$ python manage.py collectstatic

请注意，这仅在您投入生产后才需要，并且此处指定的目录不能与STATICFILES_DIRS.

网址.py

在 Django 为您的静态文件提供服务的开发过程中，您必须在 urls.py 中包含静态 url：

from django.contrib.staticfiles.urls import staticfiles_urlpatterns

urlpatterns = ...

urlpatterns += staticfiles_urlpatterns()

一旦你完成了上述所有的事情，你的静态文件应该只要你有DEBUG = True. 在上面的列表中，您似乎只完成了STATIC_URL. 另请注意，我上面描述的所有步骤都在您在问题中链接的文档（链接）中。一开始可能会有点混乱，但如果你读了几次，它就会变得更加清晰。

score 8 · Accepted Answer

尝试清除缓存。如果您使用的是谷歌浏览器，请转到设置>清除浏览数据>选择清除缓存的图像和文件，然后单击清除数据

score 2 · Accepted Answer

完成所有操作后，设置 DEBUG=True，python collectstatic，清除缓存，如果问题仍然存在，则以隐身模式打开，将您的 .css 文件复制到 static 文件夹中另一个新的 .css 文件中，然后运行 collectstatic 命令。这对我有用。我希望这能帮到您。

score 1 · Accepted Answer

将 RequestContext 添加到响应应该将 STATIC_URL 变量加载到模板中。

尝试改变：

from django.shortcuts import render_to_response

def index(request):
    return render_to_response('index.html')

到：

from django.shortcuts import render_to_response
from django.template.context import RequestContext

def index(request):
    return render_to_response("index.html", context_instance=RequestContext(request))

有关更多信息，请参阅有关在模板中引用静态文件的 Django 文档。

score 1 · Accepted Answer

如果编码没有问题并且没有显示错误。然后你可以这样做来尝试解决问题。

清除缓存：

如果您使用的是谷歌浏览器，请转到您的设置 --> 清除浏览数据 --> 选择清除缓存的图像和文件，然后单击清除数据

score 0 · Accepted Answer

如果在开发模式下发生这种情况，请确保DEBUG=True在settings.py文件中进行设置。还要确保在您的文件中设置MEDIA_URLand ，如下所示：MEDIA_ROOTsettings.py

MEDIA_URL  = '/mymediafolder/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'mymediafolder')

然后在您的主 urls 文件中myapp/urls.py，您必须具有以下内容：

from django.conf.urls import url, include
from . import views
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from django.conf.urls.static import static
from django.conf import settings

urlpatterns = [
    #Your url patterns here
]

urlpatterns += staticfiles_urlpatterns()
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

staticfiles_urlpatterns()用于在开发模式下提供静态文件。

score 0 · Accepted Answer

对我来说，它正在改变

<link rel="stylesheet" href=" {% static '/css/style.css' %} ">

到

<link rel="stylesheet" type="text/css" href=" {% static '/css/style.css' %} ">

score -1 · Accepted Answer

-1

有时只需要“Ctrl + F5”

完全刷新页面，就可以了。

或 Ctrl + Shift + R

于 2021-11-09T11:19:55.640 回答

score -4 · Accepted Answer

There is an easy way if you feel that your CSS isn't working.

如果您的项目不是太大，那么您可以将 CSS 文件与 HTML 放在同一个文件中。然后运行它。这样它将运行例如

`

<head>
  <meta charset="UTF-8">
  <title>Promantus Bot</title>
      <style type="text/css"> 
* {
    margin: 0;
    padding: 0;
}

body {
    background-color:#FF625F;
}

h1, p {
    font-family: sans-serif;
    text-align: center;
    color: #323330;
    font-size:  100px;
}


p {
    font-size: 30px;
}

#output, #container {
    display: flex;
    justify-content: center;
    margin-top: 100px;
}


input {
    background-color: #eee;
    border: none;
    font-family: sans-serif;
    color: #000;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 30px;
}






</style>


</head>

<body>

  <div id="output"></div>

<div id="container">
    <input type="text" id="input" value="">
</div>





</body>

</html>
`
It's going to run fine this way.

python - Django：CSS 不工作

设置

看法

索引.html

9 回答 9

Related

Reference