Django和css和一个很简单的例子，请 [英] Django and css and a really simple example, please

问题描述

我是django的新手，我正在尝试设置一个非常简单的django应用程序。

I'm new to django, and am trying to setup a really simple django app.

现在，我的django在线书： http://www.djangobook.com/en/2.0/chapter05/

Now, I'm up to chapter 5 in the django online book : http://www.djangobook.com/en/2.0/chapter05/

现在，我想做，现在，我开始运行数据库废话之前，是添加一些简单的css和js到应用程序。

All i want to do now, before i start running around with database nonsense, is to add in some simple css and js to the app as is.

所以问题是：我该怎么做？我只有一个应用程序，我只想要一个main.css在css文件夹和一个main.js在js文件夹。

So the question is: how do i do this? I only have one app, and i only want a main.css in a css folder, and a main.js in a js folder.

我检出了 https://docs.djangoproject.com/en/1.3/howto/static-files /＃staticfiles-in-templates 页面，但阅读和阅读后，似乎没有一个很大的工作。例如，明智的，我的意思。

i checked out the https://docs.djangoproject.com/en/1.3/howto/static-files/#staticfiles-in-templates page, but after reading and reading, there didn't seem to be a whole lot to work with. Example wise, i mean.

我如何导入样式表/ css（像，是否有一个帮助器a la cakephp？），在哪里我把css和js文件，我需要配置静态东西吗？

How do i import the stylesheets/css (like, is there a helper a la cakephp?), where do i put the css and js files, and do i need to configure the static thingy?

更新：链接：在Django-n00b问题中渲染CSS问题没有什么帮助。主要是因为它没有为我工作，但也特别不喜欢如果调试废话。当我移动到prod时会发生什么？为什么我的媒体文件夹定义不同的prod和本地dev反正？

UPDATE: the link : Render CSS in Django- n00b question does not help much. Mainly in that it didn't work for me, but also I especially don't like the "if debug" nonsense. What happens when i move to prod? Why would i have my media folder defined differently for prod and local dev anyway? Shouldn't it be relative, or even in the same spot?

推荐答案

如果你遵循django的指南，你可以简化你的生活

If you follow django's guidelines, you can simplify your life greatly.

在您的示例代码中，在您的应用程序目录中，创建一个名为 static 的文件夹。在此文件夹中，放置您的css文件。

In your sample code, inside your application directory, create a folder called static. Inside this folder, place your css files.

示例：

$ django-admin.py startproject myproject
$ cd myproject
myproject$ python manage.py startapp myapp
myproject$ mkdir myapp/static
myproject$ cd myapp/static
myproject/myapp/static$ nano style.css

在您的范本中：

< link rel =stylesheethref ={{STATIC_URL}} style.css/>

请务必将 myapp 添加到<$ c $中的 INSTALLED_APPS c> settings.py 。现在，当您使用内置的开发服务器时，您的样式表将正确呈现。

Make sure you add myapp to the INSTALLED_APPS list in settings.py. Now when you use the built-in development server, your style sheet will be rendered correctly.

默认情况下，Django在安装的应用程序中搜索 static 目录，并使用当前版本的django静态文件默认启用。

Django searches for a static directory inside installed applications by default, and with current versions of django, static files are enabled by default.

Django示例路径 my_app /static/my_app/myimage.jpg 其中
有点混乱，如果你的应用程序和项目有相同的名称。

The Django example has the path my_app/static/my_app/myimage.jpg which is a little confusing if your app and project have the same name.

建议这样做，因为当您运行 collectstatic 以收集所有静态文件时，将覆盖具有相同名称的文件。如果在另一个应用程序中有一个名为 myimage.jpg 的文件，它将被覆盖。在静态目录中提供应用程序名称将会阻止这一点，因为确切的目录结构将被复制到您的 STATIC_ROOT 目录。

This is recommended because when you run collectstatic to gather all your static files, files with the same name will be overwritten. If you have a file called myimage.jpg in another application, it will be overwritten. Giving the application name inside the static directory will prevent this, because the exact directory structure will be replicated inside your STATIC_ROOT directory.

一个简单的例子来说明这一点。如果你有一个django项目有两个应用程序，如下：

A simple example to illustrate the point. If you have a django project with two apps, like this:

.
├── assets
├── manage.py
├── myapp
│   ├── __init__.py
│   ├── models.py
│   ├── static
│   │   └── myapp
│   │       └── test.txt
│   ├── tests.py
│   └── views.py
├── myproj
│   ├── __init__.py
│   ├── __init__.pyc
│   ├── settings.py
│   ├── settings.pyc
│   ├── urls.py
│   └── wsgi.py
└── otherapp
    ├── __init__.py
    ├── models.py
    ├── static
    │   └── otherapp
    │       └── test.txt
    ├── tests.py
    └── views.py

assets c> STATIC_ROOT 。现在，当您运行 collectstatic ：

assets is your STATIC_ROOT. Now when you run collectstatic:

.
├── assets
│   ├── myapp
│   │   └── test.txt
│   └── otherapp
│       └── test.txt
├── manage.py
├── myapp
│   ├── __init__.py
│   ├── __init__.pyc
│   ├── models.py
│   ├── static
│   │   └── myapp
│   │       └── test.txt
│   ├── tests.py
│   └── views.py
├── myproj
│   ├── __init__.py
│   ├── __init__.pyc
│   ├── settings.py
│   ├── settings.pyc
│   ├── urls.py
│   └── wsgi.py
└── otherapp
    ├── __init__.py
    ├── __init__.pyc
    ├── models.py
    ├── static
    │   └── otherapp
    │       └── test.txt
    ├── tests.py
    └── views.py

您看到它正在创建目录好。在您的模板中，现在将引用每个文件及其应用程序的命名空间： {{STATIC_URL}} / myapp / test.txt

You see it is creating the directories as well. In your templates you would now refer to each file with its "namespace" of the app: {{ STATIC_URL }}/myapp/test.txt

这篇关于Django和css和一个很简单的例子，请的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！