使用Django将静态文件导入模板

时间:2015-03-26 22:30:35

标签: python html css django django-staticfiles

我在将CSS文件加载到HTML模板时遇到问题。以下是我正在使用的调用文件。任何人都可以看到为什么CSS不会加载?

settings.py

BASE_DIR = os.path.dirname(os.path.abspath(__file__))

STATIC_ROOT = 'staticfiles'

STATIC_URL = '/static/'

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
) 

words.html

{% load staticfiles %}

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

urls.py

urlpatterns = patterns('',
    url(r'^
    url(r'^Words', hello.views.index, name='index'),
    url(r'^db', hello.views.db, name='db'),
    url(r'^Add', hello.views.create, name='create'),
    url(r'^admin/', include(admin.site.urls)),
)

urlpatterns += staticfiles_urlpatterns()

words.css

 .pri {
     color: blue;
 }, hello.views.index, name='index'),

项目结构

murmurwall/
├── Procfile
├── README.md
├── hello
│   ├── __init__.py
│   ├── __init__.pyc
│   ├── __pycache__
│   │   ├── __init__.cpython-34.pyc
│   │   ├── admin.cpython-34.pyc
│   │   ├── forms.cpython-34.pyc
│   │   ├── models.cpython-34.pyc
│   │   └── views.cpython-34.pyc
│   ├── admin.py
│   ├── admin.pyc
│   ├── forms.py
│   ├── forms.pyc
│   ├── management
│   │   └── commands
│   │       ├── CSV
│   │       │   └── Pretty\ Little\ Liars.csv
│   │       ├── __pycache__
│   │       │   └── update_words.cpython-34.pyc
│   │       └── update_words.py
│   ├── models.py
│   ├── models.pyc
│   ├── static
│   │   └── hello
│   │       └── words.css
│   ├── templates
│   │   ├── add_word.html
│   │   ├── base.html
│   │   ├── db.html
│   │   └── words.html
│   ├── tests.py
│   ├── views.py
│   └── views.pyc
├── manage.py
├── murmurwall
│   ├── __init__.py
│   ├── __init__.pyc
│   ├── __pycache__
│   │   ├── __init__.cpython-34.pyc
│   │   ├── settings.cpython-34.pyc
│   │   ├── urls.cpython-34.pyc
│   │   └── wsgi.cpython-34.pyc
│   ├── settings.py
│   ├── settings.pyc
│   ├── static
│   │   └── humans.txt
│   ├── urls.py
│   ├── urls.pyc
│   ├── wsgi.py
│   └── wsgi.pyc
├── requirements.txt
├── runtime.txt
└── staticfiles
    ├── admin
    │   ├── css
    │   │   ├── base.css
    │   │   ├── changelists.css
    │   │   ├── dashboard.css
    │   │   ├── forms.css
    │   │   ├── ie.css
    │   │   ├── login.css
    │   │   ├── rtl.css
    │   │   └── widgets.css
    │   ├── img
    │   │   ├── changelist-bg.gif
    │   │   ├── changelist-bg_rtl.gif
    │   │   ├── default-bg-reverse.gif
    │   │   ├── default-bg.gif
    │   │   ├── deleted-overlay.gif
    │   │   ├── gis
    │   │   │   ├── move_vertex_off.png
    │   │   │   └── move_vertex_on.png
    │   │   ├── icon-no.gif
    │   │   ├── icon-unknown.gif
    │   │   ├── icon-yes.gif
    │   │   ├── icon_addlink.gif
    │   │   ├── icon_alert.gif
    │   │   ├── icon_calendar.gif
    │   │   ├── icon_changelink.gif
    │   │   ├── icon_clock.gif
    │   │   ├── icon_deletelink.gif
    │   │   ├── icon_error.gif
    │   │   ├── icon_searchbox.png
    │   │   ├── icon_success.gif
    │   │   ├── inline-delete-8bit.png
    │   │   ├── inline-delete.png
    │   │   ├── inline-restore-8bit.png
    │   │   ├── inline-restore.png
    │   │   ├── inline-splitter-bg.gif
    │   │   ├── nav-bg-grabber.gif
    │   │   ├── nav-bg-reverse.gif
    │   │   ├── nav-bg-selected.gif
    │   │   ├── nav-bg.gif
    │   │   ├── selector-icons.gif
    │   │   ├── selector-search.gif
    │   │   ├── sorting-icons.gif
    │   │   ├── tooltag-add.png
    │   │   └── tooltag-arrowright.png
    │   └── js
    │       ├── LICENSE-JQUERY.txt
    │       ├── SelectBox.js
    │       ├── SelectFilter2.js
    │       ├── actions.js
    │       ├── actions.min.js
    │       ├── admin
    │       │   ├── DateTimeShortcuts.js
    │       │   └── RelatedObjectLookups.js
    │       ├── calendar.js
    │       ├── collapse.js
    │       ├── collapse.min.js
    │       ├── core.js
    │       ├── inlines.js
    │       ├── inlines.min.js
    │       ├── jquery.init.js
    │       ├── jquery.js
    │       ├── jquery.min.js
    │       ├── prepopulate.js
    │       ├── prepopulate.min.js
    │       ├── timeparse.js
    │       └── urlify.js
    ├── hello
    │   └── words.css
    └── humans.txt

1 个答案:

答案 0 :(得分:0)

您的STATIC_ROOT = 'staticfiles'需要是静态文件的绝对路径。例如STATIC_ROOT = os.path.join(PROJECT_ROOT, STATIC_URL.strip("/"))。可能必须更改此部署。我用于openshift的一个例子: if 'OPENSHIFT_REPO_DIR' in os.environ: STATIC_ROOT = os.path.join(os.environ.get('OPENSHIFT_REPO_DIR'), 'wsgi', 'static') else: STATIC_ROOT = os.path.join(PROJECT_ROOT, STATIC_URL.strip("/"))

另见django static static url static root