静态文件配置

引入

#登录功能

"""
将html 文件默认放在templates文件夹下
将网站所使用的静态文件默认放在static文件夹下

静态文件
	前端写好的,能够直接调用使用的都可以称为静态文件
	网站写好的js文件
	网站写好的css文件
	网站用到的图片文件
	第三方前端框架
	...
	拿来就可以直接使用的
	
"""

#django默认不会自动创建static文件,需要手动创建
一般情况下在static文件夹内会做进一步的划分处理
	-static
    	--js
        --css
        --img
        其他第三方文件
"""
在浏览器中输入url能够看到对应的资源
是因为后端提前开设了该资源的接口
如果访问不到资源,说明后端没有开设该资源的接口

"""   

image-20221021173936220

image-20221021174520951

  • 引入了bootstrap的js文件和css文件,但是浏览器访问的时候并没有显示该有的样式,需要开设该资源的接口

image-20221021174448402

**************************************************************************************
"""
当在写django项目的时候,可能会出现后端代码修改了但是前端页面没有变化的情况
	1. 在同一个窗口开了好几个django项目,一直在跑的其实是第一个django项目
	2. 浏览器缓存的问题
		右键点击检查,setting--network--disable cache 勾选上
"""
**************************************************************************************

image-20221021181046077

静态文件配置

  • 网站通常需要提供额外的文件,如图像、JavaScript或CSS。在Django中,我们将这些文件称为“静态文件
STATIC_URL = 'static/'  # 类似于访问静态网页的令牌
"""如果想要访问静态文件,就必须以static开头"""
"""

/static/bootstrap-3.4.1-dist/js/bootstrap.min.js

/static/令牌
去列表里面从上往下依次查找
    bootstrap-3.4.1-dist/js/bootstrap.min.js
    都没有的话才会报错

"""
# 静态文件配置


STATICFILES_DIRS = [
    BASE_DIR / "static",
    BASE_DIR / "static1",
]

方法1:

<link rel="stylesheet" href="/static/bootstrap-3.4.1-dist/css/bootstrap.min.css">   直接跟static后面的路径即可,这里的static并不是我们创建的目录名称,而是令牌名字

# 静态文件动态解析
{% load static %}
    <link rel="stylesheet" href="{% static 'bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
    <script src="{% static 'bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>

方法2:动态解析static令牌,这样的好处是当我们需要更换令牌的名字的时候,不需要每个html文件更改了,只需要在setting.py里面更改即可,会动态的解析到静态文件的名称。语法如下:

{% load static %}
<link rel="stylesheet" href="{% static "bootstrap-3.4.1-dist/css/bootstrap.min.css" %} ">    
    
# form 默认是get请求数据
"""
form 表单action参数
	1. 不写。默认朝当前所在的url提交数据
	2.全写
	3.只写后缀 /login/

"""

# 在前期使用django提交post请求时,需要去配置文件中注释掉一行代码
'django.middleware.csrf.CsrfViewMiddleware'


#settings.py
MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    # 'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

静态文件css,js样式加载不出来解决

在要编辑的html文件中,删除掉第一行的<!DOCTYPE html>就可以解决
posted @ 2022-12-12 15:33  ExpiredSaury  阅读(116)  评论(0编辑  收藏  举报