1. 程式人生 > >Django配置Bootstrap, js

Django配置Bootstrap, js

title gop ont pla cal word python lin min

1、首先在APP目錄下創建一個static文件夾

如圖:技術分享

# Application definition

INSTALLED_APPS = [
    ‘django.contrib.admin‘,
    ‘django.contrib.auth‘,
    ‘django.contrib.contenttypes‘,
    ‘django.contrib.sessions‘,
    ‘django.contrib.messages‘,
    ‘django.contrib.staticfiles‘,
    ‘appBook.apps.AppbookConfig‘,
    ‘appBook‘
, ]

2、在settings.py中 最底部添加如下:



# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.11/howto/static-files/

STATIC_URL = /static/
STATIC_ROOT=(
    os.path.join(BASE_DIR,"appBook/static"),
)

3、在html頁面頭部添加:

技術分享

{% load staticfiles %}

<!DOCTYPE html>
<html lang="
en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="{% static ‘bootstrap/css/bootstrap.css‘ %}"> <style> .container{ margin-top: 80px; } </style> </head> <body>

4、在html模版頁面,可以用如下方式調用:

<img src="{% static ‘images/logo.gif‘ %}" alt=""/> 
<img src="/static/images/acer.gif" alt=""/> 
推薦使用第二種,因為如果圖片名稱是動態的,可以通過views這麽綁定: 
<img src="/static/images/{{name}}.gif" alt=""/> 
css的引用同樣如此:
<link rel="stylesheet" href="{% static ‘style/base.css’ %}" type="text/css">
<link rel="stylesheet" href="/static/style/base.css" type="text/css">
js的引用同樣如此:
<script type="text/javascript" src="{% static ‘js/jquery-1.8.3.min.js‘ %}"/>
<script type="text/javascript" src="/static/js/jquery-1.8.3.min.js"/>
可以用 python manage.py findstatic css
/index.css 尋找 css

Django:locals()小技巧

locals()返回一個包含當前作用域裏面的所有變量和它們的值的字典。

所以可以把views改寫為

def current_datetime(request): current_date = datetime.datetime.now() return render_to_response(‘current_datetime.html‘, locals())

這裏要註意的是要把now重命名為current_date,因為模板需要的是這個變量名。

在template是如下定義的:

<html>
    <body>
        <font color = "blue">It is is now {{ current_date }}.</font>
    </body>
</html>

Django配置Bootstrap, js