django bootstrap css js 文件导入

Django Settings:

在settings中定义STATIC_URL、STATICFILES_DIRS。

默认Django会在每个app下的static/app查找静态文件，如果加额外的路径寻找则在STATICFILES_DIR中设置.
STATIC_URL = '/static/'         # 若存放静态文件的static目录在app目录下，则改局生效，无需定义下面的

STATICFILES_DIRS = [              # 若存放静态文件的static目录在project目录下，则用该定义
    os.path.join(BASE_DIR, "alice_django_cbts/static"),
]

引入网上bootstrap文件：

<html><head>
<!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"> </script>
    
  </head>
  <body></body></html>

引入本地bootstrap文件：

{% load staticfiles %}  ----  很重要，一定要在文件开头配置
<html>
<head>
    <link href="{% static 'bootstrap-3.3.7-dist/css/bootstrap.min.css' %}" rel="stylesheet">
    <script  src="{% static 'bootstrap-3.3.7-dist/js/jquery-1.12.4-dist/jquery.min.js' %}"></script>
    <script src="{% static 'bootstrap-3.3.7-dist/js/bootstrap.min.js' %}"></script>
    {% block page-header %}your page header{% endblock %}</head>...</html>

django bootstrap css js 文件导入

Django Settings:

引入网上bootstrap文件：

引入本地bootstrap文件：

猜你喜欢